@streamlayer/react 1.8.6 → 1.9.1

package/lib/es/advertisement.js

@@ -1,12 +1,12 @@
-import { jsx as e, jsxs as A, Fragment as ro } from "react/jsx-runtime";
-import { useRef as j, useState as L, useCallback as Eo, useEffect as B } from "react";
-import { e as S, s as n, h as So, g as lo, i as x, Y as ko, a as co, L as Lo, u as Mo, j as Oo, b as Po, S as T, d as _o } from "./index2.js";
-import { N, a as po, b as mo, C as uo, c as Ao, P as M, d as E, A as Bo, e as xo, S as Ro } from "./useStreamLayerApp2.js";
+import { jsx as e, jsxs as v, Fragment as ro } from "react/jsx-runtime";
+import { useRef as U, useState as x, useCallback as So, useEffect as P } from "react";
+import { e as k, s as n, h as Eo, g as lo, i as R, Y as ko, a as co, L as Lo, u as Mo, j as Po, b as Oo, S as T, d as _o } from "./index2.js";
+import { N, a as po, b as mo, C as uo, c as vo, P as M, d as S, A as Bo, e as xo, S as Ro } from "./useStreamLayerApp2.js";
 const Do = /* @__PURE__ */ n("div")({
   name: "Container",
   class: "c5b6wdg",
   propsAsIs: !1
-}), qo = "a1rlj479", wo = "s35f1di", Vo = "sj4471g", jo = "b12050d8", Uo = "b1d5ybek", Fo = (o) => o === "left" || o === "right" ? wo : jo, zo = (o) => o === "left" || o === "right" ? Vo : Uo, Go = (o) => o === "left" ? "avdxyl3" : o === "right" ? "a1bisd08" : o === "top" ? "a1u9y2aj" : "a1qqaks", U = ({
+}), wo = "a1rlj479", qo = "s35f1di", Vo = "sj4471g", jo = "b12050d8", Uo = "b1d5ybek", Fo = (o) => o === "left" || o === "right" ? qo : jo, zo = (o) => o === "left" || o === "right" ? Vo : Uo, Go = (o) => o === "left" ? "avdxyl3" : o === "right" ? "a1bisd08" : o === "top" ? "a1u9y2aj" : "a1qqaks", F = ({
   children: o,
   style: s,
   className: i,
@@ -16,7 +16,7 @@ const Do = /* @__PURE__ */ n("div")({
   onAnimationEnd: c
 }) => /* @__PURE__ */ e(Do, {
   style: s,
-  className: S(i, qo, Go(r), t && !l && Fo(r), t && l && zo(r)),
+  className: k(i, wo, Go(r), t && !l && Fo(r), t && l && zo(r)),
   onAnimationEnd: c,
   children: o
 }), Wo = /* @__PURE__ */ n("a")({
@@ -36,7 +36,7 @@ const Do = /* @__PURE__ */ n("div")({
   if (!((l = o.additionalBanner) != null && l.imageUrl))
     return null;
   let c = (r = o.banner) == null ? void 0 : r.url;
-  return c && c.indexOf("http") !== 0 && (c = `https://${c}`), /* @__PURE__ */ e(U, { direction: t, hiding: i, children: /* @__PURE__ */ e(Ho, { className: "BannerContainer", children: /* @__PURE__ */ e(
+  return c && c.indexOf("http") !== 0 && (c = `https://${c}`), /* @__PURE__ */ e(F, { direction: t, hiding: i, children: /* @__PURE__ */ e(Ho, { className: "BannerContainer", children: /* @__PURE__ */ e(
     Yo,
     {
       className: "BannerLink",
@@ -64,11 +64,11 @@ const Do = /* @__PURE__ */ n("div")({
   name: "Text",
   class: "t59zdk1",
   propsAsIs: !1
-}), F = /* @__PURE__ */ n("div")({
+}), z = /* @__PURE__ */ n("div")({
   name: "MediaImgBottom",
   class: "m1ab9fq",
   propsAsIs: !1
-}), ee = () => F, ne = /* @__PURE__ */ n(ee())({
+}), ee = () => z, ne = /* @__PURE__ */ n(ee())({
   name: "MediaImgMiddle",
   class: "m9fsr0y",
   propsAsIs: !0
@@ -97,29 +97,29 @@ const Do = /* @__PURE__ */ n("div")({
   class: "n3n65jf",
   propsAsIs: !1
 }), de = {
-  [N.BOTTOM]: F,
+  [N.BOTTOM]: z,
   [N.MIDDLE]: ne
 }, ce = ({ src: o, imagePosition: s }) => {
-  const i = de[s] || F;
+  const i = de[s] || z;
   return /* @__PURE__ */ e(i, { children: /* @__PURE__ */ e("img", { src: o, alt: "" }) });
 }, pe = ({ notification: o, open: s }) => {
   if (!o || !o.promotion || o.enabled !== po.NOTIFICATION_ENABLED)
     return null;
-  const { title: i, body: t, image: l, promotion: r } = o, { sponsorLogo: c, sponsorLogoMode: p, imagePosition: v, ctaButton: a } = r;
-  return /* @__PURE__ */ A(le, { className: "SL_Lower_Third_Notification", onClick: s, children: [
-    /* @__PURE__ */ A(Qo, { children: [
-      /* @__PURE__ */ e(ce, { src: l, imagePosition: v }),
-      /* @__PURE__ */ A(Xo, { children: [
+  const { title: i, body: t, image: l, promotion: r } = o, { sponsorLogo: c, sponsorLogoMode: m, imagePosition: A, ctaButton: a } = r;
+  return /* @__PURE__ */ v(le, { className: "SL_Lower_Third_Notification", onClick: s, children: [
+    /* @__PURE__ */ v(Qo, { children: [
+      /* @__PURE__ */ e(ce, { src: l, imagePosition: A }),
+      /* @__PURE__ */ v(Xo, { children: [
         i && /* @__PURE__ */ e(Zo, { children: i }),
         t && /* @__PURE__ */ e(oe, { children: t })
       ] })
     ] }),
-    /* @__PURE__ */ A(ae, { children: [
-      p !== mo.NOTIFICATION_SPONSOR_LOGO_NONE && /* @__PURE__ */ A(ro, { children: [
+    /* @__PURE__ */ v(ae, { children: [
+      m !== mo.NOTIFICATION_SPONSOR_LOGO_NONE && /* @__PURE__ */ v(ro, { children: [
         /* @__PURE__ */ e(ie, { children: /* @__PURE__ */ e("img", { src: c, alt: i }) }),
         /* @__PURE__ */ e(re, {})
       ] }),
-      /* @__PURE__ */ A(te, { name: "promo-button", style: { color: a == null ? void 0 : a.textColor, backgroundColor: a == null ? void 0 : a.color }, children: [
+      /* @__PURE__ */ v(te, { name: "promo-button", style: { color: a == null ? void 0 : a.textColor, backgroundColor: a == null ? void 0 : a.color }, children: [
         (a == null ? void 0 : a.ctaIcon) && (a == null ? void 0 : a.ctaIconMode) === uo.CTA_ICON_TRANSPARENT && /* @__PURE__ */ e(se, { src: a == null ? void 0 : a.ctaIcon, alt: "cta-icon" }),
         (a == null ? void 0 : a.label) || "Open"
       ] })
@@ -133,39 +133,39 @@ const Do = /* @__PURE__ */ n("div")({
   name: "NotificationContainer",
   class: "nbxqmol",
   propsAsIs: !1
-}), Ae = /* @__PURE__ */ n("div")({
+}), ve = /* @__PURE__ */ n("div")({
   name: "Body",
   class: "b1gu3eml",
   propsAsIs: !1
-}), ve = /* @__PURE__ */ n("div")({
+}), Ae = /* @__PURE__ */ n("div")({
   name: "Title",
   class: "t1u17zva",
   propsAsIs: !1
-}), he = /* @__PURE__ */ n("div")({
+}), ge = /* @__PURE__ */ n("div")({
   name: "Text",
   class: "t10ko1g",
   propsAsIs: !1
-}), R = /* @__PURE__ */ n("div")({
+}), D = /* @__PURE__ */ n("div")({
   name: "Media",
   class: "mntc42e",
   propsAsIs: !1
-}), Ie = () => R, no = /* @__PURE__ */ n(Ie())({
+}), he = () => D, no = /* @__PURE__ */ n(he())({
   name: "MediaImgFit",
   class: "ml060eo",
   propsAsIs: !0
-}), ge = () => R, vo = /* @__PURE__ */ n(ge())({
+}), Ie = () => D, Ao = /* @__PURE__ */ n(Ie())({
   name: "MediaImgCentered",
   class: "m1vqlvig",
   propsAsIs: !0
-}), ye = () => vo, be = /* @__PURE__ */ n(ye())({
+}), ye = () => Ao, be = /* @__PURE__ */ n(ye())({
   name: "MediaImgBottom",
   class: "m1e7tvi5",
   propsAsIs: !0
-}), fe = () => R, Ne = /* @__PURE__ */ n(fe())({
+}), fe = () => D, Ne = /* @__PURE__ */ n(fe())({
   name: "MediaImgSolid",
   class: "mqvntt2",
   propsAsIs: !0
-}), $e = () => R, Ce = /* @__PURE__ */ n($e())({
+}), $e = () => D, Ce = /* @__PURE__ */ n($e())({
   name: "MediaImgMiddle",
   class: "m12jtj3u",
   propsAsIs: !0
@@ -173,11 +173,11 @@ const Do = /* @__PURE__ */ n("div")({
   name: "CtaIcon",
   class: "ckq1frv",
   propsAsIs: !1
-}), Ee = /* @__PURE__ */ n("button")({
+}), Se = /* @__PURE__ */ n("button")({
   name: "Button",
   class: "bis90pl",
   propsAsIs: !1
-}), Se = () => So, ke = /* @__PURE__ */ n(Se())({
+}), Ee = () => Eo, ke = /* @__PURE__ */ n(Ee())({
   name: "StyledChevronRight",
   class: "s9mjmz3",
   propsAsIs: !0
@@ -188,30 +188,30 @@ const Do = /* @__PURE__ */ n("div")({
 }), Me = {
   [N.UNSET]: no,
   [N.FIT]: no,
-  [N.CENTERED]: vo,
+  [N.CENTERED]: Ao,
   [N.BOTTOM]: be,
   [N.SOLID]: Ne,
   [N.MIDDLE]: Ce
-}, Oe = ({ src: o, imagePosition: s }) => {
+}, Pe = ({ src: o, imagePosition: s }) => {
   const i = Me[s];
   return /* @__PURE__ */ e(i, { children: /* @__PURE__ */ e("img", { src: o, alt: "" }) });
-}, Pe = ({ notification: o, open: s, promotionId: i, hiding: t, direction: l = "left" }) => {
+}, Oe = ({ notification: o, open: s, promotionId: i, hiding: t, direction: l = "left" }) => {
   if (!o || !o.promotion || o.enabled !== po.NOTIFICATION_ENABLED)
     return null;
-  if (o.promotion.mode === Ao.LOWER_THIRD)
+  if (o.promotion.mode === vo.LOWER_THIRD)
     return /* @__PURE__ */ e(pe, { notification: o, open: s });
-  const { title: r, body: c, image: p, promotion: v } = o, { sponsorLogo: a, sponsorLogoMode: h, imagePosition: u, ctaButton: m } = v;
-  return /* @__PURE__ */ e(U, { className: "SL_Rich_Notification", direction: l, hiding: t, children: /* @__PURE__ */ A(ue, { onClick: s, children: [
-    h !== mo.NOTIFICATION_SPONSOR_LOGO_NONE && /* @__PURE__ */ e(Le, { children: /* @__PURE__ */ e("img", { src: a, alt: r }) }),
-    /* @__PURE__ */ A(me, { children: [
-      /* @__PURE__ */ e(Oe, { src: p, imagePosition: u }),
-      /* @__PURE__ */ A(Ae, { children: [
-        r && /* @__PURE__ */ e(ve, { children: r }),
-        c && /* @__PURE__ */ e(he, { children: c })
+  const { title: r, body: c, image: m, promotion: A } = o, { sponsorLogo: a, sponsorLogoMode: g, imagePosition: u, ctaButton: p } = A;
+  return /* @__PURE__ */ e(F, { className: "SL_Rich_Notification", direction: l, hiding: t, children: /* @__PURE__ */ v(ue, { onClick: s, children: [
+    g !== mo.NOTIFICATION_SPONSOR_LOGO_NONE && /* @__PURE__ */ e(Le, { children: /* @__PURE__ */ e("img", { src: a, alt: r }) }),
+    /* @__PURE__ */ v(me, { children: [
+      /* @__PURE__ */ e(Pe, { src: m, imagePosition: u }),
+      /* @__PURE__ */ v(ve, { children: [
+        r && /* @__PURE__ */ e(Ae, { children: r }),
+        c && /* @__PURE__ */ e(ge, { children: c })
       ] }),
-      /* @__PURE__ */ A(Ee, { name: "promo-button", style: { color: m == null ? void 0 : m.textColor, backgroundColor: m == null ? void 0 : m.color }, children: [
-        (m == null ? void 0 : m.ctaIcon) && (m == null ? void 0 : m.ctaIconMode) === uo.CTA_ICON_TRANSPARENT && /* @__PURE__ */ e(Te, { src: m == null ? void 0 : m.ctaIcon, alt: "cta-icon" }),
-        (m == null ? void 0 : m.label) || "Open"
+      /* @__PURE__ */ v(Se, { name: "promo-button", style: { color: p == null ? void 0 : p.textColor, backgroundColor: p == null ? void 0 : p.color }, children: [
+        (p == null ? void 0 : p.ctaIcon) && (p == null ? void 0 : p.ctaIconMode) === uo.CTA_ICON_TRANSPARENT && /* @__PURE__ */ e(Te, { src: p == null ? void 0 : p.ctaIcon, alt: "cta-icon" }),
+        (p == null ? void 0 : p.label) || "Open"
       ] }),
       /* @__PURE__ */ e(ke, { name: "chevronRight" })
     ] })
@@ -220,15 +220,15 @@ const Do = /* @__PURE__ */ n("div")({
   name: "OverlayContainer",
   class: "okzhq2w",
   propsAsIs: !1
-}), ho = /* @__PURE__ */ n("div")({
+}), go = /* @__PURE__ */ n("div")({
   name: "PromoOverlay",
   class: "pmgz5i",
   propsAsIs: !1
-}), Io = /* @__PURE__ */ n("div")({
+}), ho = /* @__PURE__ */ n("div")({
   name: "Header",
   class: "hyxi3jt",
   propsAsIs: !1
-}), go = /* @__PURE__ */ n("div")({
+}), Io = /* @__PURE__ */ n("div")({
   name: "HeaderContent",
   class: "h149e3gp",
   propsAsIs: !1
@@ -256,11 +256,11 @@ const Do = /* @__PURE__ */ n("div")({
   name: "Description",
   class: "dydopmr",
   propsAsIs: !1
-}), qe = /* @__PURE__ */ n("div")({
+}), we = /* @__PURE__ */ n("div")({
   name: "Sponsor",
   class: "s1w6nt04",
   propsAsIs: !1
-}), we = /* @__PURE__ */ n("div")({
+}), qe = /* @__PURE__ */ n("div")({
   name: "SponsorText",
   class: "s1evcmtq",
   propsAsIs: !1
@@ -302,33 +302,33 @@ const Do = /* @__PURE__ */ n("div")({
   adPosition: i
 }) => {
   const t = Math.floor(o / 60), l = o - t * 60;
-  return t === 0 && l === 0 && s === i ? null : /* @__PURE__ */ A(Ge, {
-    children: [s > 1 && /* @__PURE__ */ A(ro, {
-      children: [/* @__PURE__ */ A(io, {
+  return t === 0 && l === 0 && s === i ? null : /* @__PURE__ */ v(Ge, {
+    children: [s > 1 && /* @__PURE__ */ v(ro, {
+      children: [/* @__PURE__ */ v(io, {
         children: [i, " of ", s]
       }), /* @__PURE__ */ e(We, {})]
-    }), /* @__PURE__ */ A(io, {
+    }), /* @__PURE__ */ v(io, {
       children: [t, ":", l < 10 ? `0${l}` : l]
     })]
   });
 }, Ke = (o, s, { onPlay: i, onStop: t, onProgress: l }) => {
   const r = google.ima;
-  let c = new r.AdDisplayContainer(o), p = new r.AdsLoader(c), v = new r.AdsRequest(), a;
-  p.addEventListener(
+  let c = new r.AdDisplayContainer(o), m = new r.AdsLoader(c), A = new r.AdsRequest(), a;
+  m.addEventListener(
     r.AdsManagerLoadedEvent.Type.ADS_MANAGER_LOADED,
     (u) => {
-      a = u.getAdsManager(o), i && a.addEventListener(r.AdEvent.Type.STARTED, i), t && a.addEventListener(r.AdEvent.Type.COMPLETE, t), l && a.addEventListener(r.AdEvent.Type.AD_PROGRESS, (m) => l(m.getAdData())), a.init(o.clientWidth, o.clientHeight, r.ViewMode.NORMAL), a.start();
+      a = u.getAdsManager(o), i && a.addEventListener(r.AdEvent.Type.STARTED, i), t && a.addEventListener(r.AdEvent.Type.COMPLETE, t), l && a.addEventListener(r.AdEvent.Type.AD_PROGRESS, (p) => l(p.getAdData())), a.init(o.clientWidth, o.clientHeight, r.ViewMode.NORMAL), a.start();
     },
     !1
-  ), p.addEventListener(
+  ), m.addEventListener(
     r.AdErrorEvent.Type.AD_ERROR,
     () => {
       console.log("ad error"), t == null || t();
     },
     !1
-  ), v.linearAdSlotWidth = o.clientWidth, v.linearAdSlotHeight = o.clientHeight, v.adTagUrl = s, p.requestAds(v);
-  const h = () => {
-    a == null || a.destroy(), p == null || p.destroy(), c == null || c.destroy(), c = void 0, p = void 0, v = void 0, a = void 0;
+  ), A.linearAdSlotWidth = o.clientWidth, A.linearAdSlotHeight = o.clientHeight, A.adTagUrl = s, m.requestAds(A);
+  const g = () => {
+    a == null || a.destroy(), m == null || m.destroy(), c == null || c.destroy(), c = void 0, m = void 0, A = void 0, a = void 0;
   };
   return () => {
     try {
@@ -336,7 +336,7 @@ const Do = /* @__PURE__ */ n("div")({
     } catch (u) {
       t == null || t(), console.log("AdsManager could not be started", u);
     }
-    return h;
+    return g;
   };
 }, Ye = /* @__PURE__ */ n("div")({
   name: "Container",
@@ -355,17 +355,17 @@ const Do = /* @__PURE__ */ n("div")({
   skipAutoClose: r
 }) => {
   var c;
-  const p = j(null), [v, a] = L(!1), [h, u] = L(0), [m, b] = L(0), [$, I] = L(0), g = j(), y = Eo(() => {
-    u(0), b(0), I(0), a(!1), s == null || s({
+  const m = U(null), [A, a] = x(!1), [g, u] = x(0), [p, I] = x(0), [$, h] = x(0), y = U(), b = So(() => {
+    u(0), I(0), h(0), a(!1), s == null || s({
       muted: !1
     });
   }, [s]);
-  B(() => {
-    if (l != null && l.url && p.current) {
-      y();
-      const f = Ke(p.current, l.url, {
+  P(() => {
+    if (l != null && l.url && m.current) {
+      b();
+      const f = Ke(m.current, l.url, {
         onPlay: () => {
-          x.emit("advertisement", {
+          R.emit("advertisement", {
             action: "videoPlay",
             payload: {
               id: i,
@@ -376,72 +376,84 @@ const Do = /* @__PURE__ */ n("div")({
           }), a(!0);
         },
         onStop: () => {
-          t == null || t(), y();
+          t == null || t(), b();
         },
         onProgress: (C) => {
-          u(Math.round(C.duration - C.currentTime)), b(C.totalAds), I(C.adPosition);
+          u(Math.round(C.duration - C.currentTime)), I(C.totalAds), h(C.adPosition);
         }
       })();
-      return g.current = f, () => {
-        g.current = void 0, f();
+      return y.current = f, () => {
+        y.current = void 0, f();
       };
     }
-  }, [l == null ? void 0 : l.url, s, y, i, o.type, t]);
+  }, [l == null ? void 0 : l.url, s, b, i, o.type, t]);
   const O = ((c = o.sponsor) == null ? void 0 : c.logo) && o.logoMode === M.CENTER;
-  return /* @__PURE__ */ A(ho, {
+  return /* @__PURE__ */ v(go, {
     className: "PromoOverlay",
-    children: [/* @__PURE__ */ A(Io, {
-      children: [/* @__PURE__ */ e(go, {
-        className: S(!O && yo),
+    children: [/* @__PURE__ */ v(ho, {
+      children: [/* @__PURE__ */ e(Io, {
+        className: k(!O && yo),
         children: /* @__PURE__ */ e(fo, {
           style: {
             transform: "scale(1.5)"
           },
           children: "Ad"
         })
-      }), /* @__PURE__ */ A(Je, {
+      }), /* @__PURE__ */ v(Je, {
         children: [/* @__PURE__ */ e(He, {
-          time: h,
-          adCount: m,
+          time: g,
+          adCount: p,
           adPosition: $
         }), r && /* @__PURE__ */ e(lo, {
           className: "ClosePromoIcon",
           close: () => {
             var f;
-            (f = g.current) == null || f.call(g), t == null || t(), y();
+            (f = y.current) == null || f.call(y), t == null || t(), b();
           }
         })]
       })]
     }), /* @__PURE__ */ e(bo, {
-      className: S(Qe, v && Xe, !v && Ze),
+      className: k(Qe, A && Xe, !A && Ze),
       children: /* @__PURE__ */ e(Ye, {
-        ref: p
+        ref: m
       })
     })]
   });
 }, ao = (o) => {
-  var s, i, t, l, r, c, p, v, a, h, u, m, b, $, I, g, y, O, f, C, z, G, W, H, K, Y, J, Q, X, Z;
-  const { promotion: d, controlVideo: P, skipAutoClose: No, promotionId: _, onClose: $o, markAsViewed: D, externalAd: oo } = o, q = d.type === E.INGAME_IAB11_LBAR || d.type === E.INGAME_IAB11, w = ((s = d.sponsor) == null ? void 0 : s.logo) && d.logoMode === M.CENTER, Co = !!((t = (i = d.banner) == null ? void 0 : i.video) != null && t.url), V = d.autoPlayVideo === Bo.ENABLED, [To, eo] = L(!Co || !V);
-  if (B(() => {
-    _ && d.type && D && D();
-  }, [_, d.type, D]), B(() => () => {
-    P == null || P({ muted: !1 });
-  }, [P]), oo)
-    return /* @__PURE__ */ e(on, { ...o, externalAd: oo });
-  let k = (l = d.banner) == null ? void 0 : l.url;
-  return k && k.indexOf("http") !== 0 && (k = `https://${k}`), /* @__PURE__ */ A(ho, { className: "PromoOverlay", children: [
-    /* @__PURE__ */ A(Io, { children: [
-      /* @__PURE__ */ A(go, { className: S(!w && yo), children: [
+  var s, i, t, l, r, c, m, A, a, g, u, p, I, $, h, y, b, O, f, C, G, W, H, K, Y, J, Q, X, Z, oo;
+  const {
+    promotion: d,
+    advertisementPaused: No,
+    togglePause: E,
+    controlVideo: _,
+    skipAutoClose: $o,
+    promotionId: B,
+    onClose: Co,
+    markAsViewed: w,
+    externalAd: eo
+  } = o, q = d.type === S.INGAME_IAB11_LBAR || d.type === S.INGAME_IAB11, V = ((s = d.sponsor) == null ? void 0 : s.logo) && d.logoMode === M.CENTER, To = !!((t = (i = d.banner) == null ? void 0 : i.video) != null && t.url), j = d.autoPlayVideo === Bo.ENABLED;
+  if (P(() => {
+    E == null || E(To || j);
+  }, []), P(() => {
+    B && d.type && w && w();
+  }, [B, d.type, w]), P(() => () => {
+    _ == null || _({ muted: !1 });
+  }, [_]), eo)
+    return /* @__PURE__ */ e(on, { ...o, externalAd: eo });
+  let L = (l = d.banner) == null ? void 0 : l.url;
+  return L && L.indexOf("http") !== 0 && (L = `https://${L}`), /* @__PURE__ */ v(go, { className: "PromoOverlay", children: [
+    /* @__PURE__ */ v(ho, { children: [
+      /* @__PURE__ */ v(Io, { className: k(!V && yo), children: [
         ((r = d.sponsor) == null ? void 0 : r.logo) && d.logoMode === M.LEFT && /* @__PURE__ */ e(so, { src: (c = d.sponsor) == null ? void 0 : c.logo, alt: "promo" }),
-        /* @__PURE__ */ A(
-          qe,
+        /* @__PURE__ */ v(
+          we,
           {
             style: {
-              paddingLeft: (p = d.sponsor) != null && p.logo && d.logoMode === M.LEFT ? "0px" : "8px"
+              paddingLeft: (m = d.sponsor) != null && m.logo && d.logoMode === M.LEFT ? "0px" : "8px"
             },
             children: [
-              ((v = d.sponsor) == null ? void 0 : v.logo) && d.logoMode === M.LEFT && /* @__PURE__ */ e(Be, { children: (a = d.sponsor) == null ? void 0 : a.name }),
-              /* @__PURE__ */ A(we, { className: "SponsorText", children: [
+              ((A = d.sponsor) == null ? void 0 : A.logo) && d.logoMode === M.LEFT && /* @__PURE__ */ e(Be, { children: (a = d.sponsor) == null ? void 0 : a.name }),
+              /* @__PURE__ */ v(qe, { className: "SponsorText", children: [
                 /* @__PURE__ */ e(fo, { children: "AD" }),
                 /* @__PURE__ */ e(Ve, { children: "SPONSORED" })
               ] })
@@ -453,55 +465,55 @@ const Do = /* @__PURE__ */ n("div")({
         lo,
         {
           className: "ClosePromoIcon",
-          close: $o,
-          autoClose: (h = d.closeTimer) == null ? void 0 : h.auto,
-          duration: No ? 0 : (u = d.closeTimer) == null ? void 0 : u.seconds,
-          isPlaying: To
+          close: Co,
+          autoClose: (g = d.closeTimer) == null ? void 0 : g.auto,
+          duration: $o ? 0 : (u = d.closeTimer) == null ? void 0 : u.seconds,
+          isPlaying: !No
         }
       )
     ] }),
-    /* @__PURE__ */ A(bo, { children: [
-      w && /* @__PURE__ */ e(so, { className: Re, src: (m = d.sponsor) == null ? void 0 : m.logo, alt: "promo" }),
-      /* @__PURE__ */ e(to, { children: ($ = (b = d.banner) == null ? void 0 : b.video) != null && $.url ? /* @__PURE__ */ e(
+    /* @__PURE__ */ v(bo, { children: [
+      V && /* @__PURE__ */ e(so, { className: Re, src: (p = d.sponsor) == null ? void 0 : p.logo, alt: "promo" }),
+      /* @__PURE__ */ e(to, { children: ($ = (I = d.banner) == null ? void 0 : I.video) != null && $.url ? /* @__PURE__ */ e(
         ko,
         {
-          source: (g = (I = d.banner) == null ? void 0 : I.video) == null ? void 0 : g.url,
-          poster: (O = (y = d.banner) == null ? void 0 : y.video) == null ? void 0 : O.thumbnailUrl,
+          source: (y = (h = d.banner) == null ? void 0 : h.video) == null ? void 0 : y.url,
+          poster: (O = (b = d.banner) == null ? void 0 : b.video) == null ? void 0 : O.thumbnailUrl,
           aspectRatio: q ? "1/1" : "16/9",
           onPause: () => {
-            V && eo(!1);
+            j && (E == null || E(!0));
           },
           onPlay: () => {
-            x.emit("advertisement", {
+            R.emit("advertisement", {
               action: "videoPlay",
               payload: {
-                id: _,
+                id: B,
                 type: d.type
               }
-            }), eo(!0);
+            }), E == null || E(!1);
           },
-          controlVideo: P,
-          autoPlay: V
+          controlVideo: _,
+          autoPlay: j
         }
       ) : (f = d.banner) != null && f.imageUrl ? /* @__PURE__ */ e(xe, { style: q ? { aspectRatio: "1/1" } : {}, src: (C = d.banner) == null ? void 0 : C.imageUrl, alt: "promo" }) : null }),
-      !q && /* @__PURE__ */ A(to, { children: [
-        ((z = d.banner) == null ? void 0 : z.title) && /* @__PURE__ */ e(Fe, { className: S("AdvTitle", w && ze), children: (G = d.banner) == null ? void 0 : G.title }),
-        ((W = d.banner) == null ? void 0 : W.body) && /* @__PURE__ */ e(De, { className: "AdvDescription", children: (H = d.banner) == null ? void 0 : H.body })
+      !q && /* @__PURE__ */ v(to, { children: [
+        ((G = d.banner) == null ? void 0 : G.title) && /* @__PURE__ */ e(Fe, { className: k("AdvTitle", V && ze), children: (W = d.banner) == null ? void 0 : W.title }),
+        ((H = d.banner) == null ? void 0 : H.body) && /* @__PURE__ */ e(De, { className: "AdvDescription", children: (K = d.banner) == null ? void 0 : K.body })
       ] })
     ] }),
     d.buttonType !== xo.NO_BUTTON && /* @__PURE__ */ e(je, { children: /* @__PURE__ */ e(
       Ue,
       {
-        href: k,
+        href: L,
         style: {
-          backgroundColor: ((Y = (K = d.banner) == null ? void 0 : K.ctaButton) == null ? void 0 : Y.color) || "#009dc4",
-          color: ((Q = (J = d.banner) == null ? void 0 : J.ctaButton) == null ? void 0 : Q.textColor) || "#fff"
+          backgroundColor: ((J = (Y = d.banner) == null ? void 0 : Y.ctaButton) == null ? void 0 : J.color) || "#009dc4",
+          color: ((X = (Q = d.banner) == null ? void 0 : Q.ctaButton) == null ? void 0 : X.textColor) || "#fff"
         },
         "data-analytics": "button",
-        "data-promo-id": _,
+        "data-promo-id": B,
         "data-promo-type": d.type,
         target: "_blank",
-        children: (Z = (X = d.banner) == null ? void 0 : X.ctaButton) == null ? void 0 : Z.label
+        children: (oo = (Z = d.banner) == null ? void 0 : Z.ctaButton) == null ? void 0 : oo.label
       }
     ) })
   ] });
@@ -515,7 +527,7 @@ const Do = /* @__PURE__ */ n("div")({
   style: i,
   className: t,
   hiding: l
-}) => /* @__PURE__ */ e(U, {
+}) => /* @__PURE__ */ e(F, {
   direction: s,
   style: i,
   hiding: l,
@@ -523,7 +535,7 @@ const Do = /* @__PURE__ */ n("div")({
   children: /* @__PURE__ */ e(en, {
     children: o
   })
-}), sn = (o) => (o == null ? void 0 : o.type) === E.INGAME_IAB11_LBAR || (o == null ? void 0 : o.type) === E.INGAME_IAB21_LBAR, tn = (o) => (o == null ? void 0 : o.type) === E.INGAME_IAB11 || (o == null ? void 0 : o.type) === E.INGAME_IAB21, an = ({
+}), sn = (o) => (o == null ? void 0 : o.type) === S.INGAME_IAB11_LBAR || (o == null ? void 0 : o.type) === S.INGAME_IAB21_LBAR, tn = (o) => (o == null ? void 0 : o.type) === S.INGAME_IAB11 || (o == null ? void 0 : o.type) === S.INGAME_IAB21, an = ({
   advertisement: o,
   close: s,
   skipTypeCheck: i,
@@ -531,40 +543,46 @@ const Do = /* @__PURE__ */ n("div")({
   layoutMode: l = "side-by-side",
   sidebar: r,
   isNotification: c,
-  banner: p,
-  markAsViewed: v,
+  banner: m,
+  markAsViewed: A,
   open: a,
-  externalAd: h,
-  controlVideo: u
-}) => o.promotion ? c && o.notification ? /* @__PURE__ */ e(Pe, { open: a, notification: o.notification, promotionId: o.question.id }) : !r && !p && (i || tn(o.promotion)) ? /* @__PURE__ */ e(_e, { className: "PromoOverlayContainer", children: /* @__PURE__ */ e(
+  externalAd: g,
+  controlVideo: u,
+  advertisementPaused: p,
+  togglePause: I
+}) => o.promotion ? c && o.notification ? /* @__PURE__ */ e(Oe, { open: a, notification: o.notification, promotionId: o.question.id }) : !r && !m && (i || tn(o.promotion)) ? /* @__PURE__ */ e(_e, { className: "PromoOverlayContainer", children: /* @__PURE__ */ e(
   ao,
   {
-    markAsViewed: v,
+    markAsViewed: A,
     promotionId: o.question.id,
     promotion: o.promotion,
     onClose: s,
     skipAutoClose: t,
-    externalAd: h,
-    controlVideo: u
+    externalAd: g,
+    controlVideo: u,
+    advertisementPaused: p,
+    togglePause: I
   }
 ) }) : r && (i || sn(o.promotion)) ? /* @__PURE__ */ e(nn, { className: "PromoSidebarContainer", direction: r, hiding: !1, children: /* @__PURE__ */ e(
   ao,
   {
-    markAsViewed: v,
+    markAsViewed: A,
     promotionId: o.question.id,
     promotion: o.promotion,
-    externalAd: h,
+    externalAd: g,
     onClose: s,
     controlVideo: u,
-    skipAutoClose: t
+    skipAutoClose: t,
+    advertisementPaused: p,
+    togglePause: I
   }
-) }) : p ? /* @__PURE__ */ e(
+) }) : m ? /* @__PURE__ */ e(
   Jo,
   {
     promotionId: o.question.id,
     hiding: !1,
     promotion: o.promotion,
-    direction: p
+    direction: m
   }
 ) : null : null, rn = /* @__PURE__ */ n("div")({
   name: "AdvertisementUIWrap",
@@ -573,14 +591,14 @@ const Do = /* @__PURE__ */ n("div")({
 }), ln = (o) => {
   const s = o.target;
   if (s instanceof HTMLAnchorElement && s.target === "_blank") {
-    const i = s.getAttribute("data-promo-id") || "", t = s.getAttribute("data-promo-type") || E.UNSET;
-    s.getAttribute("data-analytics") === "button" && x.emit("advertisement", {
+    const i = s.getAttribute("data-promo-id") || "", t = s.getAttribute("data-promo-type") || S.UNSET;
+    s.getAttribute("data-analytics") === "button" && R.emit("advertisement", {
       action: "buttonSelect",
       payload: {
         id: i,
         type: t
       }
-    }), s.getAttribute("data-analytics") === "banner" && x.emit("advertisement", {
+    }), s.getAttribute("data-analytics") === "banner" && R.emit("advertisement", {
       action: "bannerSelect",
       payload: {
         id: i,
@@ -596,41 +614,43 @@ const Do = /* @__PURE__ */ n("div")({
   sidebar: l,
   banner: r,
   notification: c,
-  isMobileScreen: p,
-  persistent: v,
+  isMobileScreen: m,
+  persistent: A,
   externalAd: a,
-  controlVideo: h
+  controlVideo: g
 }) => {
-  var u, m, b;
-  const $ = j(null), I = co(o.advertisement.$store);
+  var u, p, I;
+  const $ = U(null), h = co(o.advertisement.$store);
   Lo($, {
-    enabled: !!I.data,
+    enabled: !!h.data,
     event: "click",
     listener: ln
   });
-  const g = !r && !l;
-  if (I.data === void 0 || !v && I.isViewed)
+  const y = !r && !l;
+  if (h.data === void 0 || !A && h.isViewed)
     return null;
-  const y = ((b = (m = (u = I == null ? void 0 : I.data) == null ? void 0 : u.notification) == null ? void 0 : m.promotion) == null ? void 0 : b.mode) === Ao.LOWER_THIRD;
+  const b = ((I = (p = (u = h == null ? void 0 : h.data) == null ? void 0 : u.notification) == null ? void 0 : p.promotion) == null ? void 0 : I.mode) === vo.LOWER_THIRD;
   return /* @__PURE__ */ e(rn, {
     ref: $,
     style: {
-      height: g ? "auto" : "100%"
+      height: y ? "auto" : "100%"
     },
-    className: S("SL-AdvertisementUIWrap", p && "mobile-view", y && "SL-AdvertisementUIWrap--lower-third"),
+    className: k("SL-AdvertisementUIWrap", m && "mobile-view", b && "SL-AdvertisementUIWrap--lower-third"),
     children: /* @__PURE__ */ e(an, {
       skipTypeCheck: t,
       sidebar: l,
       banner: r,
-      advertisement: I.data,
-      close: I.close,
-      externalAd: a ? I.externalAd : void 0,
+      advertisement: h.data,
+      advertisementPaused: h.isPaused,
+      togglePause: h.togglePause,
+      close: h.close,
+      externalAd: a ? h.externalAd : void 0,
       markAsViewed: o.advertisement.markAsViewed,
       open: o.advertisement.open,
       layoutMode: s,
       isNotification: c,
       skipAutoClose: i,
-      controlVideo: h
+      controlVideo: g
     })
   });
 }, cn = ({
@@ -641,15 +661,15 @@ const Do = /* @__PURE__ */ n("div")({
   skipAutoClose: l,
   skipTypeCheck: r,
   layoutMode: c,
-  isMobileScreen: p,
-  persistent: v,
+  isMobileScreen: m,
+  persistent: A,
   notification: a
 }) => {
-  const h = co(o.featuresList.getStore());
-  if (B(() => {
+  const g = co(o.featuresList.getStore());
+  if (P(() => {
     if (i) {
-      const m = document.createElement("script");
-      m.async = !0, m.src = "https://imasdk.googleapis.com/js/sdkloader/ima3.js", document.body.appendChild(m);
+      const p = document.createElement("script");
+      p.async = !0, p.src = "https://imasdk.googleapis.com/js/sdkloader/ima3.js", document.body.appendChild(p);
     }
   }, [i]), s && t)
     return /* @__PURE__ */ e("div", {
@@ -665,7 +685,7 @@ const Do = /* @__PURE__ */ n("div")({
       },
       children: "externalAd is not supported with banner"
     });
-  if (!h)
+  if (!g)
     return null;
   const u = o.getFeature(Ro.GAMES);
   return u ? /* @__PURE__ */ e(dn, {
@@ -673,15 +693,15 @@ const Do = /* @__PURE__ */ n("div")({
     sidebar: s,
     banner: t,
     layoutMode: c,
-    isMobileScreen: p,
-    persistent: v,
+    isMobileScreen: m,
+    persistent: A,
     notification: a,
     skipTypeCheck: r,
     skipAutoClose: l,
     externalAd: i,
     controlVideo: o.controlVideoPlayer
   }) : null;
-}, vn = ({
+}, An = ({
   event: o,
   sidebar: s,
   banner: i,
@@ -689,22 +709,22 @@ const Do = /* @__PURE__ */ n("div")({
   skipAutoClose: l,
   persistent: r,
   theme: c,
-  notification: p,
-  skipTypeCheck: v,
+  notification: m,
+  skipTypeCheck: A,
   externalAd: a
 }) => {
-  const h = Mo(), u = Oo(), m = Po();
-  return h ? a && !u.promotionExternalAd ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : !a && u.promotionExternalAd ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : s && !u.promotionSidebar ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : i && !u.promotionBanner ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : p && !u.promotionNotification ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : !i && !s && !p && !u.promotionOverlay ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : /* @__PURE__ */ A("div", { className: "StreamLayerSDK", children: [
-    /* @__PURE__ */ e(_o, { customTheme: c ?? m, children: /* @__PURE__ */ e(
+  const g = Mo(), u = Po(), p = Oo();
+  return g ? a && !u.promotionExternalAd ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : !a && u.promotionExternalAd ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : s && !u.promotionSidebar ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : i && !u.promotionBanner ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : m && !u.promotionNotification ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : !i && !s && !m && !u.promotionOverlay ? o !== void 0 && /* @__PURE__ */ e(T, { event: o }) : /* @__PURE__ */ v("div", { className: "StreamLayerSDK", children: [
+    /* @__PURE__ */ e(_o, { customTheme: c ?? p, children: /* @__PURE__ */ e(
       cn,
       {
-        sdk: h,
+        sdk: g,
         sidebar: s,
         banner: i,
         isMobileScreen: t,
         persistent: r,
-        notification: p,
-        skipTypeCheck: v,
+        notification: m,
+        skipTypeCheck: A,
         skipAutoClose: l,
         layoutMode: "side-by-side",
         externalAd: a
@@ -714,6 +734,6 @@ const Do = /* @__PURE__ */ n("div")({
   ] }) : null;
 };
 export {
-  vn as StreamLayerSDKAdvertisement,
+  An as StreamLayerSDKAdvertisement,
   cn as StreamLayerSDKAdvertisementUI
 };