@streamlayer/react 1.21.4 → 1.22.2

package/lib/classic/es/notification.js

@@ -1,1008 +1,9 @@
-import { jsxs as l, jsx as s } from "react/jsx-runtime";
-import { useState as w, useRef as _, useEffect as y, useCallback as As, useMemo as Is } from "react";
-import { s as n, B as A, D as hs, v as $s, x as K, w as G, z as gs, E as ws, O as x, y as ys, f as Ts, e as bs, i as Cs, N as O, u as fs, d as ks, c as Ns, h as qs } from "./provider.js";
-import "nanostores";
-import "lodash.throttle";
-import "react-dom";
-import "react-countup";
-import { Q as v, j as h, k as H, l as L, S as Es, A as R } from "./useStreamLayerApp2.js";
-const b = /* @__PURE__ */ n("div")({
-  name: "Media",
-  class: "m1bcvojl",
-  propsAsIs: !1
-}), Ls = () => b, Ss = /* @__PURE__ */ n(Ls())({
-  name: "MediaImgBottom",
-  class: "m58gin0",
-  propsAsIs: !0
-}), xs = () => b, E = /* @__PURE__ */ n(xs())({
-  name: "MediaImgSolid",
-  class: "m1atm8do",
-  propsAsIs: !0
-}), Ds = () => b, Ms = /* @__PURE__ */ n(Ds())({
-  name: "MediaImgRounded",
-  class: "myx3xoi",
-  propsAsIs: !0
-}), Os = () => b, Rs = /* @__PURE__ */ n(Os())({
-  name: "MediaImgCentered",
-  class: "m1bwv0gx",
-  propsAsIs: !0
-}), js = () => b, Bs = /* @__PURE__ */ n(js())({
-  name: "MediaImgInsight",
-  class: "mntjanp",
-  propsAsIs: !0
-}), Ps = /* @__PURE__ */ n("div")({
-  name: "VideoIcon",
-  class: "v1kofb47",
-  propsAsIs: !1
-}), zs = {
-  [v.UNSET]: E,
-  [v.NONE]: E,
-  [v.ROUNDED]: Ms,
-  [v.CENTERED]: Rs,
-  [v.TRANSPARENT]: Ss,
-  [v.SOLID]: E
-}, j = ({
-  src: e,
-  imageMode: i = v.UNSET,
-  withVideo: t,
-  fromInsight: o
-}) => {
-  if (i === v.NONE)
-    return null;
-  const a = o ? Bs : zs[i];
-  return /* @__PURE__ */ l(a, {
-    children: [/* @__PURE__ */ s("img", {
-      src: e,
-      alt: ""
-    }), t && /* @__PURE__ */ s(Ps, {
-      children: /* @__PURE__ */ s(A, {
-        name: "icon-play"
-      })
-    })]
-  });
-}, Us = /* @__PURE__ */ n("div")({
-  name: "NotificationContent",
-  class: "nuraq9m",
-  propsAsIs: !1
-}), Vs = /* @__PURE__ */ n("div")({
-  name: "NotificationContainer",
-  class: "ns1nzpg",
-  propsAsIs: !1
-}), J = /* @__PURE__ */ n("div")({
-  name: "Body",
-  class: "b1j59nzs",
-  propsAsIs: !1
-}), Fs = /* @__PURE__ */ n("div")({
-  name: "Title",
-  class: "t9vmnpp",
-  propsAsIs: !1
-}), Qs = /* @__PURE__ */ n("button")({
-  name: "Button",
-  class: "b14ivj5k",
-  propsAsIs: !1
-}), Ws = () => A, Ys = /* @__PURE__ */ n(Ws())({
-  name: "StyledChevronRight",
-  class: "s1atci8n",
-  propsAsIs: !0
-}), _s = /* @__PURE__ */ n("div")({
-  name: "QuoteWrap",
-  class: "q4w8jgs",
-  propsAsIs: !1
-}), Ks = /* @__PURE__ */ n("blockquote")({
-  name: "Quote",
-  class: "qaa0kez",
-  propsAsIs: !1
-}), Gs = /* @__PURE__ */ n("div")({
-  name: "Body",
-  class: "b1wvd52w",
-  propsAsIs: !1
-}), Hs = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "ccvukea",
-  propsAsIs: !1
-}), Js = ({ image: e, tweet: i, account: t, accountVerified: o, body: a, title: p }) => {
-  var d;
-  return /* @__PURE__ */ l(Hs, { children: [
-    p && /* @__PURE__ */ s(_s, { children: /* @__PURE__ */ s(Ks, { children: p }) }),
-    /* @__PURE__ */ s(
-      hs,
-      {
-        image: e,
-        name: (d = i == null ? void 0 : i.meta) == null ? void 0 : d.accountName,
-        userName: t,
-        verified: o,
-        createdTweet: i == null ? void 0 : i.date
-      }
-    ),
-    /* @__PURE__ */ s(Gs, { children: $s(a) })
-  ] });
-}, Xs = ({ title: e, questionType: i, questionTypeData: t }) => /* @__PURE__ */ l(J, { children: [
-  /* @__PURE__ */ s(
-    K,
-    {
-      questionTypeData: t,
-      questionType: i,
-      questionStatus: H.UNSET
-    }
-  ),
-  e && /* @__PURE__ */ s(Fs, { children: e })
-] }), Zs = ({ tweet: e }) => e ? /* @__PURE__ */ s(J, { children: /* @__PURE__ */ s(Js, { ...e, controlVideo: () => {
-} }) }) : null, se = ({ action: e, questionType: i, inApp: t, insight: o, tweet: a }) => {
-  var p;
-  const d = G[i], r = gs[i];
-  if (!d || !t || !t.notification)
-    return null;
-  const { title: m, image: u, imageMode: $ } = t.notification;
-  let I = u;
-  i === h.TWEET && a != null && a.tweetMedia && (I = a.tweetMedia.image), $ === v.NONE && (I = "");
-  const g = t.useMediaFromContent && (o == null ? void 0 : o.image), c = i === h.TWEET && ((p = a == null ? void 0 : a.tweetMedia) == null ? void 0 : p.video) || i === h.FACTOID && (o == null ? void 0 : o.video);
-  return /* @__PURE__ */ s(Vs, { "data-a": "intr", className: "SL_InApp", onClick: e, children: /* @__PURE__ */ l(Us, { style: I ? {} : { paddingLeft: "1.5rem" }, children: [
-    I && !g && /* @__PURE__ */ s(j, { src: I, imageMode: $, withVideo: !!c }),
-    g && /* @__PURE__ */ s(j, { src: g, fromInsight: !0, withVideo: !!c }),
-    i === h.TWEET ? /* @__PURE__ */ s(Zs, { tweet: a }) : /* @__PURE__ */ s(Xs, { questionTypeData: d, questionType: i, title: m }),
-    /* @__PURE__ */ s(Qs, { name: "inapp-button", children: r || "Open" }),
-    /* @__PURE__ */ s(Ys, { name: "chevronRight" })
-  ] }) });
-}, ee = () => ({
-  color: e
-}) => e, B = /* @__PURE__ */ n("div")({
-  name: "MediaComponentWrap",
-  class: "mek728j",
-  propsAsIs: !1,
-  vars: {
-    "mek728j-0": [ee()]
-  }
-}), T = /* @__PURE__ */ n("div")({
-  name: "Media",
-  class: "m461t56",
-  propsAsIs: !1
-}), ne = () => T, oe = /* @__PURE__ */ n(ne())({
-  name: "MediaImgBottom",
-  class: "m22bh04",
-  propsAsIs: !0
-}), ie = () => T, te = /* @__PURE__ */ n(ie())({
-  name: "MediaVideo",
-  class: "m17u1e34",
-  propsAsIs: !0
-}), ae = () => T, re = /* @__PURE__ */ n(ae())({
-  name: "MediaImgContentMedia",
-  class: "m4j3eds",
-  propsAsIs: !0
-}), ce = () => T, le = /* @__PURE__ */ n(ce())({
-  name: "MediaImgSolid",
-  class: "m1lp3swr",
-  propsAsIs: !0
-}), de = () => T, pe = /* @__PURE__ */ n(de())({
-  name: "MediaImgRounded",
-  class: "mc7lij",
-  propsAsIs: !0
-}), me = () => T, ue = /* @__PURE__ */ n(me())({
-  name: "MediaImgCentered",
-  class: "mwwaw7o",
-  propsAsIs: !0
-}), ve = () => T, S = /* @__PURE__ */ n(ve())({
-  name: "MediaNone",
-  class: "mqfzyyr",
-  propsAsIs: !0
-}), Ae = "v170mtgf", Ie = {
-  [v.UNSET]: S,
-  [v.NONE]: S,
-  [v.ROUNDED]: pe,
-  [v.CENTERED]: ue,
-  [v.TRANSPARENT]: oe,
-  [v.SOLID]: le
-}, P = ({
-  src: e,
-  imageMode: i = v.UNSET,
-  withVideo: t,
-  color: o,
-  useContentMedia: a,
-  thumbnailUrl: p
-}) => {
-  if (!e)
-    return /* @__PURE__ */ s(B, {
-      color: o,
-      children: /* @__PURE__ */ s(S, {})
-    });
-  const d = a === L.ENABLED ? re : Ie[i];
-  return /* @__PURE__ */ s(B, {
-    color: o,
-    children: t ? /* @__PURE__ */ s(te, {
-      children: /* @__PURE__ */ s(ws, {
-        className: Ae,
-        source: e,
-        poster: p || ""
-      })
-    }) : /* @__PURE__ */ s(d, {
-      children: /* @__PURE__ */ s("img", {
-        src: e,
-        alt: ""
-      })
-    })
-  });
-}, he = () => ({
-  withoutPadding: e
-}) => e ? "0px" : "1rem", X = /* @__PURE__ */ n("div")({
-  name: "NotificationContent",
-  class: "n1p3bk1c",
-  propsAsIs: !1,
-  vars: {
-    "n1p3bk1c-0": [he()]
-  }
-}), $e = /* @__PURE__ */ n("div")({
-  name: "MainContent",
-  class: "m1g211mu",
-  propsAsIs: !1
-}), ge = () => A, we = /* @__PURE__ */ n(ge())({
-  name: "StyledChevronRight",
-  class: "sx1hq4c",
-  propsAsIs: !0
-}), Z = /* @__PURE__ */ n("div")({
-  name: "NotificationContainer",
-  class: "n1fcriet",
-  propsAsIs: !1
-}), ye = () => ({
-  questionType: e
-}) => e === h.FACTOID ? "7.3rem" : "4.5rem", Te = () => ({
-  webos: e
-}) => e ? "11px 0px 8px 0px" : "11px 0px", be = () => ({
-  imageMode: e,
-  webos: i
-}) => i ? "330px" : e === v.SOLID ? "310px" : e === v.CENTERED || e === v.ROUNDED || e === v.TRANSPARENT ? "370px" : "430px", Ce = /* @__PURE__ */ n("div")({
-  name: "Body",
-  class: "b1byyovs",
-  propsAsIs: !1,
-  vars: {
-    "b1byyovs-0": [ye()],
-    "b1byyovs-1": [Te()],
-    "b1byyovs-2": [be()]
-  }
-}), fe = () => ({
-  webos: e
-}) => e ? "0.85rem" : "1.033rem", ke = () => ({
-  webos: e
-}) => e ? "0.95rem" : "1.25rem", Ne = () => ({
-  webos: e
-}) => e ? "4.7rem" : "2.25rem", qe = () => ({
-  webos: e
-}) => e ? "pre-wrap" : "nowrap", Ee = /* @__PURE__ */ n("div")({
-  name: "Title",
-  class: "t1y5k5id",
-  propsAsIs: !1,
-  vars: {
-    "t1y5k5id-0": [fe()],
-    "t1y5k5id-1": [ke()],
-    "t1y5k5id-2": [Ne()],
-    "t1y5k5id-3": [qe()]
-  }
-}), Le = /* @__PURE__ */ n("div")({
-  name: "Description",
-  class: "dw9eb7l",
-  propsAsIs: !1
-}), Se = /* @__PURE__ */ n("div")({
-  name: "LogoImgContainer",
-  class: "ldu8wgy",
-  propsAsIs: !1
-}), ss = /* @__PURE__ */ n("img")({
-  name: "LogoImg",
-  class: "ln4a3eh",
-  propsAsIs: !1
-}), xe = () => Z, De = /* @__PURE__ */ n(xe())({
-  name: "NotificationInterstitialContainer",
-  class: "no2k63v",
-  propsAsIs: !0
-}), Me = /* @__PURE__ */ n("div")({
-  name: "TVButtons",
-  class: "th9nn6a",
-  propsAsIs: !1
-}), es = /* @__PURE__ */ n("button")({
-  name: "TVButton",
-  class: "t1eee77p",
-  propsAsIs: !1
-}), Oe = () => es, Re = /* @__PURE__ */ n(Oe())({
-  name: "DismissButton",
-  class: "ds000hw",
-  propsAsIs: !0
-}), je = () => es, Be = /* @__PURE__ */ n(je())({
-  name: "AnswerButton",
-  class: "a1nz9hoe",
-  propsAsIs: !0
-}), Pe = ({ title: e, questionType: i, questionTypeData: t, description: o, imageMode: a, webos: p }) => /* @__PURE__ */ l(Ce, { imageMode: a, questionType: i, webos: p, children: [
-  /* @__PURE__ */ s(
-    K,
-    {
-      questionTypeData: t,
-      questionType: i,
-      questionStatus: H.UNSET
-    }
-  ),
-  e && /* @__PURE__ */ s(Ee, { webos: p, children: e }),
-  o && /* @__PURE__ */ s(Le, { children: o })
-] }), ze = x(De), Ue = x(Re), Ve = x(Be), Fe = ({
-  sponsorLogo: e,
-  onClick: i,
-  webos: t
-}) => /* @__PURE__ */ s(ze, { autoFocus: !0, webos: t, onClick: i, "data-webos": t, children: /* @__PURE__ */ s(X, { withoutPadding: !0, children: /* @__PURE__ */ s(ss, { src: e }) }) }), Qe = ({
-  action: e,
-  close: i,
-  questionType: t,
-  inApp: o,
-  insight: a,
-  color: p,
-  webos: d
-}) => {
-  var r, m, u;
-  const [$, I] = w(!1), g = _();
-  y(() => (o != null && o.sponsorLogo && (I(!0), g.current = setTimeout(() => {
-    I(!1);
-  }, 5e3)), () => clearTimeout(g.current)), [o == null ? void 0 : o.sponsorLogo]);
-  const c = G[t];
-  if (!c || !o || !o.notification)
-    return null;
-  const { title: ds, image: ps, imageMode: f, useContentMedia: k } = o.notification, ms = t === h.FACTOID ? a == null ? void 0 : a.heading : ds, us = t === h.FACTOID ? a == null ? void 0 : a.body : "", vs = ps, N = t === h.FACTOID && ((r = a == null ? void 0 : a.video) == null ? void 0 : r.url) && (o == null ? void 0 : o.isVideo) && k === L.ENABLED, q = k === L.ENABLED ? N ? (m = a == null ? void 0 : a.video) == null ? void 0 : m.url : a == null ? void 0 : a.image : "";
-  return o != null && o.sponsorLogo && $ ? /* @__PURE__ */ s(
-    Fe,
-    {
-      sponsorLogo: o == null ? void 0 : o.sponsorLogo,
-      webos: d,
-      onClick: () => I(!1)
-    }
-  ) : /* @__PURE__ */ l(
-    Z,
-    {
-      "data-a": "intr",
-      className: "SL_InApp",
-      onClick: (C) => {
-        d || e == null || e(C);
-      },
-      "data-is-insight": t === h.FACTOID,
-      "data-webos": d,
-      children: [
-        (o == null ? void 0 : o.sponsorLogo) && /* @__PURE__ */ s(Se, { children: /* @__PURE__ */ s(ss, { src: o == null ? void 0 : o.sponsorLogo }) }),
-        /* @__PURE__ */ l(X, { children: [
-          /* @__PURE__ */ l($e, { children: [
-            !q && /* @__PURE__ */ s(P, { src: vs, imageMode: f, withVideo: !!N, color: p }),
-            q && /* @__PURE__ */ s(
-              P,
-              {
-                src: q,
-                imageMode: f,
-                withVideo: !!N,
-                color: p,
-                useContentMedia: k,
-                thumbnailUrl: (u = a == null ? void 0 : a.video) == null ? void 0 : u.thumbnailUrl
-              }
-            ),
-            /* @__PURE__ */ s(
-              Pe,
-              {
-                questionTypeData: c,
-                questionType: t,
-                title: ms,
-                description: us,
-                imageMode: f,
-                webos: d
-              }
-            )
-          ] }),
-          !d && /* @__PURE__ */ s(we, { name: "chevronRight" }),
-          d && /* @__PURE__ */ l(Me, { children: [
-            /* @__PURE__ */ s(
-              Ue,
-              {
-                webos: !0,
-                "data-close-btn": "true",
-                onClick: (C) => {
-                  C.stopPropagation(), i == null || i(C);
-                },
-                children: "Dismiss"
-              }
-            ),
-            /* @__PURE__ */ s(Ve, { webos: !0, autoFocus: !0, onClick: e, children: "Answer" })
-          ] })
-        ] })
-      ]
-    }
-  );
-}, We = /* @__PURE__ */ n("div")({
-  name: "NotificationContainer",
-  class: "n11jcrxe",
-  propsAsIs: !1
-}), z = /* @__PURE__ */ n("img")({
-  name: "Icon",
-  class: "i1vmpt6u",
-  propsAsIs: !1
-}), Ye = /* @__PURE__ */ n("div")({
-  name: "IconContainer",
-  class: "i180665s",
-  propsAsIs: !1
-}), _e = () => A, Ke = /* @__PURE__ */ n(_e())({
-  name: "TitleIcon",
-  class: "t16zzzei",
-  propsAsIs: !0
-}), Ge = () => ys, He = /* @__PURE__ */ n(Ge())({
-  name: "Close",
-  class: "c1sur0q2",
-  propsAsIs: !0
-}), Je = /* @__PURE__ */ n("div")({
-  name: "Body",
-  class: "bai9j52",
-  propsAsIs: !1
-}), Xe = /* @__PURE__ */ n("div")({
-  name: "Title",
-  class: "t1bnt25p",
-  propsAsIs: !1
-}), Ze = /* @__PURE__ */ n("div")({
-  name: "Description",
-  class: "dmixjec",
-  propsAsIs: !1
-}), sn = /* @__PURE__ */ n("button")({
-  name: "Button",
-  class: "b1ubkw1q",
-  propsAsIs: !1
-}), en = ({
-  open: e,
-  close: i,
-  ...t
-}) => {
-  var o, a;
-  return /* @__PURE__ */ l(
-    We,
-    {
-      "data-a": "intr",
-      onClick: () => {
-        e == null || e(), t && t.markIstantOpen();
-      },
-      children: [
-        /* @__PURE__ */ l(Ye, { children: [
-          /* @__PURE__ */ s(z, { className: "on-light", src: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/notification.png" }),
-          /* @__PURE__ */ s(
-            z,
-            {
-              className: "on-dark",
-              src: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/notification-dark.png"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ l(Je, { children: [
-          /* @__PURE__ */ l(Xe, { children: [
-            /* @__PURE__ */ s(Ke, { name: "icon-trophy-solid" }),
-            (o = t == null ? void 0 : t.titleCard) == null ? void 0 : o.title
-          ] }),
-          /* @__PURE__ */ l(Ze, { children: [
-            /* @__PURE__ */ s("span", { children: (a = t == null ? void 0 : t.titleCard) == null ? void 0 : a.subtitle }),
-            /* @__PURE__ */ s(sn, { name: "inapp-button", children: "Play Now" })
-          ] })
-        ] }),
-        /* @__PURE__ */ s(
-          He,
-          {
-            close: (p) => {
-              p == null || p.stopPropagation(), i == null || i();
-            }
-          }
-        )
-      ]
-    }
-  );
-}, nn = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "cef8huz",
-  propsAsIs: !1
-}), on = () => A, tn = /* @__PURE__ */ n(on())({
-  name: "CheckIcon",
-  class: "c1mo15kk",
-  propsAsIs: !0
-}), an = () => A, rn = /* @__PURE__ */ n(an())({
-  name: "PredictionIcon",
-  class: "p16zkqnm",
-  propsAsIs: !0
-}), cn = /* @__PURE__ */ n("div")({
-  name: "PredictionIconContainer",
-  class: "pjszi7a",
-  propsAsIs: !1
-}), ln = /* @__PURE__ */ n("div")({
-  name: "BodyContainer",
-  class: "bftbmo3",
-  propsAsIs: !1
-}), dn = /* @__PURE__ */ n("div")({
-  name: "Body",
-  class: "barrbyu",
-  propsAsIs: !1
-}), pn = /* @__PURE__ */ n("div")({
-  name: "Subtitle",
-  class: "sz7237i",
-  propsAsIs: !1
-}), mn = ({
-  step: e,
-  children: i,
-  answer: t,
-  state: o = "pending"
-}) => {
-  const [a, p] = w(0), [d] = w(() => new ResizeObserver((m) => {
-    window.requestAnimationFrame(() => {
-      var u, $;
-      p((($ = (u = m == null ? void 0 : m[0]) == null ? void 0 : u.contentRect) == null ? void 0 : $.width) ?? 0);
-    });
-  })), r = As((m) => {
-    m ? d.observe(m) : d.disconnect();
-  }, [d]);
-  return y(() => () => {
-    d.disconnect();
-  }, [d]), /* @__PURE__ */ l(nn, {
-    children: [/* @__PURE__ */ s(cn, {
-      children: /* @__PURE__ */ s(rn, {
-        name: "icon-prediction"
-      })
-    }), /* @__PURE__ */ s(ln, {
-      style: {
-        minWidth: `${a}px`
-      },
-      children: /* @__PURE__ */ s(dn, {
-        children: i
-      }, e)
-    }), /* @__PURE__ */ s(pn, {
-      ref: r,
-      className: o,
-      children: /* @__PURE__ */ l("div", {
-        children: [/* @__PURE__ */ s(tn, {
-          name: "icon-check"
-        }), "Your Pick: ", t]
-      })
-    })]
-  });
-}, un = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "ckyzolp",
-  propsAsIs: !1
-}), D = /* @__PURE__ */ n("div")({
-  name: "Line",
-  class: "l16t1zr7",
-  propsAsIs: !1
-}), vn = () => D, An = /* @__PURE__ */ n(vn())({
-  name: "Line1",
-  class: "le78kvg",
-  propsAsIs: !0
-}), In = () => D, hn = /* @__PURE__ */ n(In())({
-  name: "Line2",
-  class: "l1o7966d",
-  propsAsIs: !0
-}), $n = () => D, gn = /* @__PURE__ */ n($n())({
-  name: "Line3",
-  class: "lu9lyxq",
-  propsAsIs: !0
-}), wn = () => /* @__PURE__ */ l(un, {
-  children: [/* @__PURE__ */ s(An, {
-    children: /* @__PURE__ */ s("div", {})
-  }), /* @__PURE__ */ s(hn, {
-    children: /* @__PURE__ */ s("div", {})
-  }), /* @__PURE__ */ s(gn, {
-    children: /* @__PURE__ */ s("div", {})
-  })]
-}), yn = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "c10jy6zf",
-  propsAsIs: !1
-}), Tn = () => A, bn = /* @__PURE__ */ n(Tn())({
-  name: "CheckIcon",
-  class: "c1c7scay",
-  propsAsIs: !0
-}), Cn = () => /* @__PURE__ */ l(yn, {
-  children: [/* @__PURE__ */ s(bn, {
-    name: "icon-check"
-  }), " Prediction results are in!"]
-}), fn = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "cf6k2yy",
-  propsAsIs: !1
-}), kn = /* @__PURE__ */ n("div")({
-  name: "Caption",
-  class: "c1c8xjus",
-  propsAsIs: !1
-}), Nn = /* @__PURE__ */ n("div")({
-  name: "Title",
-  class: "t1d1uekn",
-  propsAsIs: !1
-}), qn = ({
-  title: e
-}) => /* @__PURE__ */ l(fn, {
-  children: [/* @__PURE__ */ s(kn, {
-    children: "Results for"
-  }), /* @__PURE__ */ s(Nn, {
-    children: e
-  })]
-}), ns = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "c181a1as",
-  propsAsIs: !1
-}), os = /* @__PURE__ */ n("div")({
-  name: "Title",
-  class: "t1cduox6",
-  propsAsIs: !1
-}), En = () => A, is = /* @__PURE__ */ n(En())({
-  name: "CorrectIcon",
-  class: "c1onrv6j",
-  propsAsIs: !0
-}), Ln = () => is, Sn = /* @__PURE__ */ n(Ln())({
-  name: "InCorrectIcon",
-  class: "i17n9o7e",
-  propsAsIs: !0
-}), xn = () => /* @__PURE__ */ l(ns, {
-  children: [/* @__PURE__ */ l(os, {
-    children: ["Congratulations!", /* @__PURE__ */ s("br", {}), "You answered correctly."]
-  }), /* @__PURE__ */ s(is, {
-    name: "icon-check"
-  })]
-}), Dn = ({
-  title: e
-}) => /* @__PURE__ */ l(ns, {
-  children: [/* @__PURE__ */ l(os, {
-    children: ["Better luck next time!", /* @__PURE__ */ s("br", {}), "Correct: ", e]
-  }), /* @__PURE__ */ s(Sn, {
-    name: "icon-cross"
-  })]
-}), Mn = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "cnxgcs2",
-  propsAsIs: !1
-}), On = /* @__PURE__ */ n("div")({
-  name: "Title",
-  class: "t903f8n",
-  propsAsIs: !1
-}), Rn = () => A, jn = /* @__PURE__ */ n(Rn())({
-  name: "CheckIcon",
-  class: "ceyu3qj",
-  propsAsIs: !0
-}), Bn = ({
-  points: e
-}) => /* @__PURE__ */ l(Mn, {
-  children: [/* @__PURE__ */ l(On, {
-    children: ["You won ", /* @__PURE__ */ s(Ts, {
-      delay: 0.5,
-      prefix: "+",
-      suffix: " points",
-      value: e
-    })]
-  }), /* @__PURE__ */ s(jn, {
-    name: "icon-trophy-solid"
-  })]
-}), U = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "cq3agu2",
-  propsAsIs: !1
-}), V = /* @__PURE__ */ n("div")({
-  name: "Body",
-  class: "b16qj0do",
-  propsAsIs: !1
-}), F = {
-  1: 3e3,
-  2: 4e3,
-  3: 4e3,
-  4: 4e3
-}, Pn = ({ close: e, action: i, setStep: t, votedAnswer: o, correct: a, correctAnswerTitle: p, questionTitle: d, step: r }) => {
-  if (y(() => {
-    if (t) {
-      const u = setTimeout(() => {
-        F[r + 1] && (a || r < 3) ? t(r + 1) : e == null || e();
-      }, F[r]);
-      return () => {
-        u && clearTimeout(u);
-      };
-    }
-    return () => {
-    };
-  }, [t, r, e, a]), r === 1)
-    return /* @__PURE__ */ s(U, { children: /* @__PURE__ */ s(V, { children: /* @__PURE__ */ s(Cn, {}) }) });
-  let m = "pending";
-  return (r === 3 || r === 4) && (m = a ? "correct" : "incorrect"), /* @__PURE__ */ s(U, { "data-a": "intr", onClick: () => i == null ? void 0 : i(), children: /* @__PURE__ */ l(V, { children: [
-    r !== 1 && /* @__PURE__ */ s(wn, {}, r),
-    /* @__PURE__ */ l(mn, { state: m, step: r, answer: (o == null ? void 0 : o.title) || "unknown", children: [
-      r === 2 && /* @__PURE__ */ s(qn, { title: d || "unknown" }),
-      r === 3 && a && /* @__PURE__ */ s(xn, {}),
-      r === 3 && !a && /* @__PURE__ */ s(Dn, { title: p || "unknown" }),
-      r === 4 && /* @__PURE__ */ s(Bn, { points: (o == null ? void 0 : o.points) || 0 })
-    ] })
-  ] }) });
-}, zn = ({ close: e, action: i, votedAnswer: t, correct: o, correctAnswerTitle: a, questionTitle: p }) => {
-  const [d, r] = w(1);
-  return /* @__PURE__ */ s(
-    Pn,
-    {
-      close: e,
-      action: i,
-      votedAnswer: t,
-      correct: o,
-      correctAnswerTitle: a,
-      questionTitle: p,
-      setStep: r,
-      step: d,
-      title: ""
-    }
-  );
-}, Un = /* @__PURE__ */ n("div")({
-  name: "NotificationContainer",
-  class: "n1i4h28u",
-  propsAsIs: !1
-}), Vn = (e) => /* @__PURE__ */ s(Un, { children: /* @__PURE__ */ s(zn, { ...e }) }), Fn = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "cwa9tgs",
-  propsAsIs: !1
-}), Qn = /* @__PURE__ */ n("div")({
-  name: "BodyContainer",
-  class: "b1xx7swj",
-  propsAsIs: !1
-}), Wn = /* @__PURE__ */ n("div")({
-  name: "Body",
-  class: "b1a21en",
-  propsAsIs: !1
-}), Yn = ({
-  step: e,
-  children: i,
-  state: t = "pending"
-}) => {
-  const [o, a] = w(0);
-  return y(() => {
-    const p = new ResizeObserver((d) => {
-      window.requestAnimationFrame(() => {
-        var r, m;
-        const u = ((m = (r = d == null ? void 0 : d[0]) == null ? void 0 : r.contentRect) == null ? void 0 : m.width) ?? 0;
-        a(u);
-      });
-    });
-    return () => {
-      p.disconnect();
-    };
-  }, []), /* @__PURE__ */ s(Fn, {
-    style: {
-      padding: `${e === 3 && t === "incorrect" || e === 1 ? "5px 100px" : "5px 40px"}`
-    },
-    children: /* @__PURE__ */ s(Qn, {
-      style: {
-        minWidth: `${o}px`
-      },
-      children: /* @__PURE__ */ s(Wn, {
-        children: i
-      }, e)
-    })
-  });
-}, _n = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "c1nd5cu8",
-  propsAsIs: !1
-}), M = /* @__PURE__ */ n("div")({
-  name: "Line",
-  class: "lgbipw0",
-  propsAsIs: !1
-}), Kn = () => M, Gn = /* @__PURE__ */ n(Kn())({
-  name: "Line1",
-  class: "l1anth16",
-  propsAsIs: !0
-}), Hn = () => M, Jn = /* @__PURE__ */ n(Hn())({
-  name: "Line2",
-  class: "l193yd7v",
-  propsAsIs: !0
-}), Xn = () => M, Zn = /* @__PURE__ */ n(Xn())({
-  name: "Line3",
-  class: "lhbflsp",
-  propsAsIs: !0
-}), so = () => /* @__PURE__ */ l(_n, {
-  children: [/* @__PURE__ */ s(Gn, {
-    children: /* @__PURE__ */ s("div", {})
-  }), /* @__PURE__ */ s(Jn, {
-    children: /* @__PURE__ */ s("div", {})
-  }), /* @__PURE__ */ s(Zn, {
-    children: /* @__PURE__ */ s("div", {})
-  })]
-}), eo = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "c1lvd429",
-  propsAsIs: !1
-}), no = () => A, oo = /* @__PURE__ */ n(no())({
-  name: "PredictionIcon",
-  class: "p1n4m87t",
-  propsAsIs: !0
-}), io = () => /* @__PURE__ */ l(eo, {
-  children: [/* @__PURE__ */ s(oo, {
-    name: "icon-prediction"
-  }), " Prediction results are in!"]
-}), to = () => A, ao = /* @__PURE__ */ n(to())({
-  name: "CheckIcon",
-  class: "c126r8f9",
-  propsAsIs: !0
-}), ro = /* @__PURE__ */ n("div")({
-  name: "Answer",
-  class: "a1o2rpgl",
-  propsAsIs: !1
-}), co = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "cej6ci1",
-  propsAsIs: !1
-}), lo = /* @__PURE__ */ n("div")({
-  name: "Title",
-  class: "tob24mr",
-  propsAsIs: !1
-}), po = ({
-  title: e,
-  answer: i
-}) => /* @__PURE__ */ l(co, {
-  children: [/* @__PURE__ */ s(lo, {
-    children: e
-  }), /* @__PURE__ */ l(ro, {
-    children: [/* @__PURE__ */ s(ao, {
-      name: "icon-prediction"
-    }), "Your Pick: ", i]
-  })]
-}), ts = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "c1lesal4",
-  propsAsIs: !1
-}), as = /* @__PURE__ */ n("div")({
-  name: "Title",
-  class: "tv66n4w",
-  propsAsIs: !1
-}), mo = () => A, uo = /* @__PURE__ */ n(mo())({
-  name: "CorrectIcon",
-  class: "cx0vlv2",
-  propsAsIs: !0
-}), rs = /* @__PURE__ */ n("div")({
-  name: "Answer",
-  class: "akfh4v5",
-  propsAsIs: !1
-}), vo = ({
-  answer: e
-}) => /* @__PURE__ */ l(ts, {
-  children: [/* @__PURE__ */ s(as, {
-    children: "Congratulations! You answered correctly."
-  }), /* @__PURE__ */ l(rs, {
-    children: [/* @__PURE__ */ s(uo, {
-      name: "icon-correct"
-    }), "Your Pick: ", e]
-  })]
-}), Ao = ({
-  title: e,
-  answer: i
-}) => /* @__PURE__ */ l(ts, {
-  children: [/* @__PURE__ */ l(as, {
-    children: ["Better luck next time!", /* @__PURE__ */ s("br", {}), "Correct: ", e]
-  }), /* @__PURE__ */ l(rs, {
-    children: ["Your Pick: ", i]
-  })]
-}), Q = /* @__PURE__ */ n("div")({
-  name: "Container",
-  class: "cmox3ot",
-  propsAsIs: !1
-}), W = /* @__PURE__ */ n("div")({
-  name: "Body",
-  class: "bqq1ix4",
-  propsAsIs: !1
-}), Y = {
-  1: 3e3,
-  2: 4e3,
-  3: 4e3
-}, Io = ({ close: e, action: i, setStep: t, votedAnswer: o, correct: a, correctAnswerTitle: p, questionTitle: d, step: r }) => {
-  if (y(() => {
-    if (t) {
-      const u = setTimeout(() => {
-        Y[r + 1] && (a || r < 3) ? t(r + 1) : e == null || e();
-      }, Y[r]);
-      return () => {
-        u && clearTimeout(u);
-      };
-    }
-    return () => {
-    };
-  }, [t, r, e, a]), r === 1)
-    return /* @__PURE__ */ s(Q, { children: /* @__PURE__ */ s(W, { children: /* @__PURE__ */ s(io, {}) }) });
-  let m = "pending";
-  return r === 3 && (m = a ? "correct" : "incorrect"), /* @__PURE__ */ s(Q, { "data-a": "intr", onClick: () => i == null ? void 0 : i(), children: /* @__PURE__ */ l(W, { children: [
-    r !== 1 && /* @__PURE__ */ s(so, {}, r),
-    /* @__PURE__ */ l(Yn, { state: m, step: r, children: [
-      r === 2 && /* @__PURE__ */ s(po, { title: d || "unknown", answer: (o == null ? void 0 : o.title) || "unknown" }),
-      r === 3 && a && /* @__PURE__ */ s(vo, { answer: (o == null ? void 0 : o.title) || "unknown" }),
-      r === 3 && !a && /* @__PURE__ */ s(Ao, { title: p || "unknown", answer: (o == null ? void 0 : o.title) || "unknown" })
-    ] })
-  ] }) });
-}, ho = ({ close: e, action: i, votedAnswer: t, correct: o, correctAnswerTitle: a, questionTitle: p }) => {
-  const [d, r] = w(1);
-  return /* @__PURE__ */ s(
-    Io,
-    {
-      close: e,
-      action: i,
-      votedAnswer: t,
-      correct: o,
-      correctAnswerTitle: a,
-      questionTitle: p,
-      setStep: r,
-      step: d,
-      title: ""
-    }
-  );
-}, cs = /* @__PURE__ */ n("div")({
-  name: "NotificationContainer",
-  class: "nn0nqh6",
-  propsAsIs: !1
-}), $o = () => ({
-  withoutPadding: e
-}) => e ? "0px" : "1rem", go = /* @__PURE__ */ n("div")({
-  name: "NotificationContent",
-  class: "n1bcdf3j",
-  propsAsIs: !1,
-  vars: {
-    "n1bcdf3j-0": [$o()]
-  }
-}), ls = /* @__PURE__ */ n("img")({
-  name: "LogoImg",
-  class: "l8jorbq",
-  propsAsIs: !1
-}), wo = () => cs, yo = /* @__PURE__ */ n(wo())({
-  name: "NotificationInterstitialContainer",
-  class: "nf920y3",
-  propsAsIs: !0
-}), To = /* @__PURE__ */ n("div")({
-  name: "LogoImgContainer",
-  class: "lzsmehn",
-  propsAsIs: !1
-}), bo = ({ sponsorLogo: e, onClick: i }) => /* @__PURE__ */ s(yo, { onClick: i, children: /* @__PURE__ */ s(go, { withoutPadding: !0, children: /* @__PURE__ */ s(ls, { src: e }) }) }), Co = (e) => {
-  var i, t, o, a, p;
-  const [d, r] = w(!1), m = _();
-  return y(() => {
-    var u;
-    return (u = e == null ? void 0 : e.inApp) != null && u.sponsorLogo && (r(!0), m.current = setTimeout(() => {
-      r(!1);
-    }, 5e3)), () => clearTimeout(m.current);
-  }, [(i = e == null ? void 0 : e.inApp) == null ? void 0 : i.sponsorLogo]), (t = e == null ? void 0 : e.inApp) != null && t.sponsorLogo && d ? /* @__PURE__ */ s(bo, { sponsorLogo: (o = e.inApp) == null ? void 0 : o.sponsorLogo, onClick: () => r(!1) }) : /* @__PURE__ */ s(cs, { children: /* @__PURE__ */ l("div", { children: [
-    ((a = e == null ? void 0 : e.inApp) == null ? void 0 : a.sponsorLogo) && /* @__PURE__ */ s(To, { children: /* @__PURE__ */ s(ls, { src: (p = e == null ? void 0 : e.inApp) == null ? void 0 : p.sponsorLogo }) }),
-    /* @__PURE__ */ s(ho, { ...e })
-  ] }) });
-}, fo = ({ sdk: e, webos: i }) => {
-  var t, o, a, p, d, r, m, u;
-  const [$] = w(e.getNotificationsStore()), I = bs($), g = e.getFeature(Es.GAMES), c = Is(() => e.getActiveNotification(), [e, I]);
-  return y(() => {
-    c && Cs.emit("notification", {
-      action: "rendered",
-      payload: {
-        questionId: c.data.questionId,
-        questionType: c.data.questionType
-      }
-    });
-  }, [c]), c && c.type === O.QUESTION_RESOLVED ? c.data.question && c.data.questionType === h.PREDICTION ? c && ((t = c.data.inApp) == null ? void 0 : t.adUnit) === R.STANDART ? /* @__PURE__ */ s(
-    Co,
-    {
-      action: c.action,
-      close: c.close,
-      ...c.data.question,
-      inApp: c.data.inApp
-    }
-  ) : /* @__PURE__ */ s(
-    Vn,
-    {
-      action: c.action,
-      close: c.close,
-      ...c.data.question
-    }
-  ) : null : c && c.type === O.ONBOARDING ? c.data.onboarding ? /* @__PURE__ */ s(
-    en,
-    {
-      open: g == null ? void 0 : g.openOnboarding,
-      close: c.close,
-      ...c.data.onboarding
-    }
-  ) : null : c && ((o = c.data.inApp) == null ? void 0 : o.adUnit) === R.STANDART ? /* @__PURE__ */ s(
-    Qe,
-    {
-      ...c.data,
-      action: c.action,
-      close: c.close,
-      color: ((d = (p = (a = c == null ? void 0 : c.data) == null ? void 0 : a.inApp) == null ? void 0 : p.notification) == null ? void 0 : d.indicatorColor) || ((u = (m = (r = c == null ? void 0 : c.data) == null ? void 0 : r.inApp) == null ? void 0 : m.appearance) == null ? void 0 : u.primaryColor),
-      webos: i
-    }
-  ) : c && /* @__PURE__ */ s(se, { ...c.data, action: c.action });
-}, Mo = ({ theme: e }) => {
-  const i = fs(), t = ks(), o = Ns();
-  return i && (o.appNotification || o.onboardingNotification) ? o.app && !o.onboardingNotification ? null : /* @__PURE__ */ s("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ s(qs, { customTheme: e ?? t.theme, themeMode: t.themeMode, children: /* @__PURE__ */ s(fo, { sdk: i }) }) }) : null;
-};
+import "react/jsx-runtime";
+import "./index7.js";
+import { a as e, K as p } from "./notification2.js";
+import "react";
+import "./hooks-B0Qttldg.js";
 export {
-  Mo as StreamLayerSDKNotification,
-  fo as StreamLayerSDKNotificationUI
+  e as StreamLayerSDKNotification,
+  p as StreamLayerSDKNotificationUI
 };