@streamlayer/react 1.21.0 → 1.21.1

package/lib/es/pause-ad.js

@@ -1,39 +1,39 @@
-import { jsx as a, jsxs as I } from "react/jsx-runtime";
-import { j as K, k as F, e as k, s as p, l as M, n as _, f as j, u as q, d as G, h as N } from "./provider.js";
+import { jsx as l, jsxs as L } from "react/jsx-runtime";
+import { j as K, k as M, e as k, s as m, l as _, n as $, f as F, u as N, d as j, h as q } from "./provider.js";
 import "nanostores";
-import { useRef as D, useCallback as L, useState as R, useEffect as T, Component as $ } from "react";
+import { useRef as D, useCallback as I, useState as R, useEffect as T, Component as O } from "react";
 import "@nanostores/react";
 import "lodash.throttle";
 import "react-dom";
 import "react-countup";
 import { c as z } from "./vast-client.min-B0NUra1B.js";
-const O = {}, W = new z(), b = F(O), E = K("ui:gam-static"), U = (e) => new Promise((s, t) => {
-  const n = new Image();
-  n.onload = () => s(e), n.onerror = () => t(), n.src = e;
+const G = {}, J = new z(), w = M(G), E = K("ui:gam-static"), U = (e) => new Promise((s, t) => {
+  const a = new Image();
+  a.onload = () => s(e), a.onerror = () => t(), a.src = e;
 }), V = () => {
   const e = D(0);
-  return [L(async (s) => {
-    var t, n, r, d, c, i, h, l, f, g, y;
-    if ((t = b.get()[s]) != null && t.imageSrc)
+  return [I(async (s) => {
+    var t, a, r, c, d, n, h, i, f, g, y;
+    if ((t = w.get()[s]) != null && t.imageSrc)
       return { success: !0 };
     const v = Date.now();
-    e.current = v, b.setKey(s, { id: "", url: s });
+    e.current = v, w.setKey(s, { id: "", url: s });
     try {
       k.emit("exposedPauseAd", {
         action: "load",
         payload: {}
       });
-      const u = await W.get(s);
-      if (E.debug(u, "parsedVAST"), e.current === v && b.get()[s].url) {
-        const o = u.ads.find((m) => m.creatives.length > 0);
+      const u = await J.get(s);
+      if (E.debug(u, "parsedVAST"), e.current === v && w.get()[s].url) {
+        const o = u.ads.find((p) => p.creatives.length > 0);
         if (o) {
           E.debug(o, "validAd");
-          const m = o.creatives.find((A) => A.type === "nonlinear");
-          if (m) {
-            E.debug(m, "nonlinear");
-            const A = (r = (n = m.variations) == null ? void 0 : n[0]) == null ? void 0 : r.staticResource, C = (c = (d = m.variations) == null ? void 0 : d[0]) == null ? void 0 : c.nonlinearClickThroughURLTemplate;
+          const p = o.creatives.find((A) => A.type === "nonlinear");
+          if (p) {
+            E.debug(p, "nonlinear");
+            const A = (r = (a = p.variations) == null ? void 0 : a[0]) == null ? void 0 : r.staticResource, C = (d = (c = p.variations) == null ? void 0 : c[0]) == null ? void 0 : d.nonlinearClickThroughURLTemplate;
             if (A)
-              return await U(A), b.setKey(s, {
+              return await U(A), w.setKey(s, {
                 id: o.id || "",
                 url: s,
                 imageSrc: A,
@@ -47,12 +47,12 @@ const O = {}, W = new z(), b = F(O), E = K("ui:gam-static"), U = (e) => new Prom
           }
           const P = o.creatives.find((A) => A.type === "companion");
           E.debug(P, "companion");
-          const w = (f = (l = (h = (i = P == null ? void 0 : P.variations) == null ? void 0 : i[0]) == null ? void 0 : h.staticResources) == null ? void 0 : l[0]) == null ? void 0 : f.url, S = (y = (g = P == null ? void 0 : P.variations) == null ? void 0 : g[0]) == null ? void 0 : y.companionClickThroughURLTemplate;
-          if (w)
-            return await U(w), b.setKey(s, {
+          const b = (f = (i = (h = (n = P == null ? void 0 : P.variations) == null ? void 0 : n[0]) == null ? void 0 : h.staticResources) == null ? void 0 : i[0]) == null ? void 0 : f.url, S = (y = (g = P == null ? void 0 : P.variations) == null ? void 0 : g[0]) == null ? void 0 : y.companionClickThroughURLTemplate;
+          if (b)
+            return await U(b), w.setKey(s, {
               id: o.id || "",
               url: s,
-              imageSrc: w,
+              imageSrc: b,
               adUrl: S
             }), k.emit("exposedPauseAd", {
               action: "loaded",
@@ -66,58 +66,54 @@ const O = {}, W = new z(), b = F(O), E = K("ui:gam-static"), U = (e) => new Prom
       console.error("Error parsing VAST", u);
     }
     return { success: !1 };
-  }, []), b];
-}, X = /* @__PURE__ */ p("div")({
+  }, []), w];
+}, Q = /* @__PURE__ */ m("div")({
   name: "PauseAdOverlay",
   class: "pw9gih8",
   propsAsIs: !1
-}), H = /* @__PURE__ */ p("div")({
+}), H = /* @__PURE__ */ m("div")({
   name: "PauseAdContent",
   class: "p8lpomy",
   propsAsIs: !1
-}), J = /* @__PURE__ */ p("div")({
-  name: "PauseAdGradientRight",
+}), W = /* @__PURE__ */ m("div")({
+  name: "PauseAdTopLeft",
   class: "pv7u167",
   propsAsIs: !1
-}), Q = /* @__PURE__ */ p("div")({
-  name: "PauseAdGradientBottom",
+}), X = /* @__PURE__ */ m("h2")({
+  name: "PauseAdTitle",
   class: "p1kh2yb0",
   propsAsIs: !1
-}), Y = /* @__PURE__ */ p("div")({
-  name: "PauseAdTopLeft",
+}), Y = /* @__PURE__ */ m("p")({
+  name: "PauseAdCaption",
   class: "pl8f94x",
   propsAsIs: !1
-}), Z = /* @__PURE__ */ p("h2")({
-  name: "PauseAdTitle",
+}), Z = /* @__PURE__ */ m("div")({
+  name: "PauseAdBottomLeft",
   class: "p1m6zmrt",
   propsAsIs: !1
-}), ee = /* @__PURE__ */ p("p")({
-  name: "PauseAdCaption",
+}), ee = /* @__PURE__ */ m("button")({
+  name: "PauseAdPlayButton",
   class: "pm3vwfa",
   propsAsIs: !1
-}), se = /* @__PURE__ */ p("div")({
-  name: "PauseAdBottomLeft",
+}), se = /* @__PURE__ */ m("div")({
+  name: "PauseAdSidebarGradient",
   class: "p1tibuhw",
   propsAsIs: !1
-}), re = /* @__PURE__ */ p("button")({
-  name: "PauseAdPlayButton",
-  class: "ptqqrqd",
-  propsAsIs: !1
-}), te = /* @__PURE__ */ p("div")({
+}), re = /* @__PURE__ */ m("div")({
   name: "PauseAdSidebar",
-  class: "p14estxv",
+  class: "ptqqrqd",
   propsAsIs: !1
-}), oe = /* @__PURE__ */ p("span")({
+}), te = /* @__PURE__ */ m("span")({
   name: "PauseAdTitleDescription",
-  class: "p1dpvfl1",
+  class: "p14estxv",
   propsAsIs: !1
-}), B = /* @__PURE__ */ p("img")({
+}), B = /* @__PURE__ */ m("img")({
   name: "ExternalAdContainer",
-  class: "ezfmabr",
+  class: "e1dpvfl1",
   propsAsIs: !1
-}), ae = ({ vastUrl: e, isDesktop: s }) => {
+}), oe = ({ vastUrl: e, isDesktop: s }) => {
   var t;
-  const [, n] = V(), r = j(n, { keys: [e] });
+  const [, a] = V(), r = F(a, { keys: [e] });
   return T(() => {
     r && r[e] && r[e].imageSrc && r[e].id && k.emit("exposedPauseAd", {
       action: "rendered",
@@ -125,7 +121,7 @@ const O = {}, W = new z(), b = F(O), E = K("ui:gam-static"), U = (e) => new Prom
         id: r[e].id
       }
     });
-  }, [r, e]), (t = r == null ? void 0 : r[e]) != null && t.imageSrc ? !r[e].adUrl || !s ? /* @__PURE__ */ a(B, { src: r[e].imageSrc }) : /* @__PURE__ */ a(
+  }, [r, e]), (t = r == null ? void 0 : r[e]) != null && t.imageSrc ? !r[e].adUrl || !s ? /* @__PURE__ */ l(B, { src: r[e].imageSrc }) : /* @__PURE__ */ l(
     "a",
     {
       onClick: () => {
@@ -139,19 +135,19 @@ const O = {}, W = new z(), b = F(O), E = K("ui:gam-static"), U = (e) => new Prom
       href: r[e].adUrl,
       target: "_blank",
       rel: "noopener noreferrer",
-      children: /* @__PURE__ */ a(B, { src: r[e].imageSrc })
+      children: /* @__PURE__ */ l(B, { src: r[e].imageSrc })
     }
   ) : null;
-}, ne = ({ isClosing: e, title: s, caption: t, onPlay: n, onClose: r, vastUrl: d, options: c, isDesktop: i }) => {
-  const h = (c == null ? void 0 : c.showPauseButton) ?? !0, { ref: l, focusSelf: f } = M.useFocusable({
+}, ae = ({ isClosing: e, title: s, caption: t, onPlay: a, onClose: r, vastUrl: c, options: d, isDesktop: n }) => {
+  const h = (d == null ? void 0 : d.showPauseButton) ?? !0, { ref: i, focusSelf: f } = _.useFocusable({
     focusKey: "sl-pause-ad-play",
-    onEnterRelease: n,
+    onEnterRelease: a,
     isFocusBoundary: !0,
     forceFocus: !0
   });
   return T(() => {
-    l.current && f();
-  }, [l, f]), T(() => {
+    i.current && f();
+  }, [i, f]), T(() => {
     if (!r)
       return () => {
       };
@@ -163,36 +159,34 @@ const O = {}, W = new z(), b = F(O), E = K("ui:gam-static"), U = (e) => new Prom
       }
     };
     return window.addEventListener("keydown", g, { capture: !0 }), () => window.removeEventListener("keydown", g, { capture: !0 });
-  }, [r]), /* @__PURE__ */ a(X, { className: _("SL_PauseAdOverlay", e && "pause-ad-closing"), children: /* @__PURE__ */ I(H, { children: [
-    /* @__PURE__ */ a(J, {}),
-    /* @__PURE__ */ a(Q, {}),
-    /* @__PURE__ */ I(Y, { children: [
-      /* @__PURE__ */ a(Z, { children: s }),
-      /* @__PURE__ */ a(ee, { children: t })
+  }, [r]), /* @__PURE__ */ l(Q, { className: $("SL_PauseAdOverlay", e && "pause-ad-closing"), children: /* @__PURE__ */ L(H, { children: [
+    /* @__PURE__ */ L(W, { children: [
+      /* @__PURE__ */ l(X, { children: s }),
+      /* @__PURE__ */ l(Y, { children: t })
     ] }),
-    h && /* @__PURE__ */ a(se, { children: /* @__PURE__ */ a(
-      re,
+    h && /* @__PURE__ */ l(Z, { children: /* @__PURE__ */ l(
+      ee,
       {
-        ref: l,
-        onClick: n,
-        onMouseEnter: () => l.current.focus(),
+        ref: i,
+        onClick: a,
+        onMouseEnter: () => i.current.focus(),
         "aria-label": "Resume playback"
       }
     ) }),
-    /* @__PURE__ */ I(te, { children: [
-      d && /* @__PURE__ */ a(ae, { isDesktop: i, vastUrl: d }),
-      /* @__PURE__ */ a(oe, { children: "ADVERTISEMENT" })
-    ] })
+    /* @__PURE__ */ l(se, { className: "SL_PauseAdSidebar", children: /* @__PURE__ */ L(re, { children: [
+      c && /* @__PURE__ */ l(oe, { isDesktop: n, vastUrl: c }),
+      /* @__PURE__ */ l(te, { children: "ADVERTISEMENT" })
+    ] }) })
   ] }) });
-}, ie = ({ showPauseAd: e, vastUrls: s, title: t, caption: n, sdk: r, onClose: d, onRender: c, options: i, isDesktop: h }) => {
-  const l = (i == null ? void 0 : i.pauseAdDelay) ?? 5e3, [f, g] = R(!1), [y, v] = R(!1), u = D(), o = s == null ? void 0 : s[0].url, m = D(o);
-  m.current = o;
-  const [P, w] = V(), S = L(() => {
-    d && (k.emit("exposedPauseAd", {
+}, ne = ({ showPauseAd: e, vastUrls: s, title: t, caption: a, sdk: r, onClose: c, onRender: d, options: n, isDesktop: h }) => {
+  const i = (n == null ? void 0 : n.pauseAdDelay) ?? 5e3, [f, g] = R(!1), [y, v] = R(!1), u = D(), o = s == null ? void 0 : s[0].url, p = D(o);
+  p.current = o;
+  const [P, b] = V(), S = I(() => {
+    c && (k.emit("exposedPauseAd", {
       action: "closed",
       payload: {}
-    }), d());
-  }, [d]), A = L(() => {
+    }), c());
+  }, [c]), A = I(() => {
     r.controlVideoPlayer({ play: !0 });
   }, [r]);
   return T(() => {
@@ -201,19 +195,19 @@ const O = {}, W = new z(), b = F(O), E = K("ui:gam-static"), U = (e) => new Prom
         action: "enabled",
         payload: {}
       }), P(o).then((x) => {
-        m.current === o && (x == null ? void 0 : x.success) !== !0 && (clearTimeout(u.current), S == null || S());
+        p.current === o && (x == null ? void 0 : x.success) !== !0 && (clearTimeout(u.current), S == null || S());
       }).catch(() => {
-        m.current === o && (clearTimeout(u.current), S == null || S());
+        p.current === o && (clearTimeout(u.current), S == null || S());
       });
       const C = () => {
-        const x = w.get()[m.current];
+        const x = b.get()[p.current];
         x != null && x.imageSrc ? (clearTimeout(u.current), v(!1), g(!0)) : u.current = setTimeout(() => {
           C();
         }, 200);
       };
       u.current = setTimeout(() => {
         C();
-      }, l);
+      }, i);
     } else
       k.emit("exposedPauseAd", {
         action: "disabled",
@@ -224,61 +218,61 @@ const O = {}, W = new z(), b = F(O), E = K("ui:gam-static"), U = (e) => new Prom
     return () => {
       u.current && clearTimeout(u.current);
     };
-  }, [w, P, S, l, e, o]), T(() => {
-    c == null || c({ rendered: f });
-  }, [f, c]), T(() => () => {
-    c == null || c({ rendered: !1 });
-  }, [c]), f ? /* @__PURE__ */ a(
-    ne,
+  }, [b, P, S, i, e, o]), T(() => {
+    d == null || d({ rendered: f });
+  }, [f, d]), T(() => () => {
+    d == null || d({ rendered: !1 });
+  }, [d]), f ? /* @__PURE__ */ l(
+    ae,
     {
       onClose: S,
       isClosing: y,
       title: t,
-      caption: n,
+      caption: a,
       onPlay: A,
       vastUrl: o,
-      options: i,
+      options: n,
       isDesktop: h
     }
   ) : null;
-}, le = ({
+}, ie = ({
   showPauseAd: e,
   pauseAdVastUrl: s,
   videoPlayerController: t,
-  onRenderPauseAd: n,
+  onRenderPauseAd: a,
   onClosePauseAd: r,
-  children: d,
-  options: c
+  children: c,
+  options: d
 }) => {
-  const i = q(), h = G(), l = D();
-  return T(() => i ? (t && (l.current = t, i.addVideoPlayerController(l.current)), () => {
-    l.current && i.removeVideoPlayerController(l.current);
+  const n = N(), h = j(), i = D();
+  return T(() => n ? (t && (i.current = t, n.addVideoPlayerController(i.current)), () => {
+    i.current && n.removeVideoPlayerController(i.current);
   }) : () => {
-  }, [i, t]), i ? /* @__PURE__ */ a("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ I(
-    N,
+  }, [n, t]), n ? /* @__PURE__ */ l("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ L(
+    q,
     {
-      style: d ? { position: "relative" } : {},
+      style: c ? { position: "relative" } : {},
       customTheme: h.theme,
       themeMode: h.themeMode,
       children: [
-        d,
-        s && /* @__PURE__ */ a(
-          ie,
+        c,
+        s && /* @__PURE__ */ l(
+          ne,
           {
-            sdk: i,
+            sdk: n,
             showPauseAd: e,
             vastUrls: s,
             onClose: r,
-            onRender: n,
-            options: c,
+            onRender: a,
+            options: d,
             isDesktop: !0
           }
         )
       ]
     }
-  ) }) : d;
+  ) }) : c;
 };
-class Ae extends $ {
+class ye extends O {
   constructor(s) {
     super(s), this.state = { hasError: !1 };
   }
@@ -289,9 +283,9 @@ class Ae extends $ {
     console.error(s, t.componentStack);
   }
   render() {
-    return this.state.hasError ? this.props.children : /* @__PURE__ */ a(le, { ...this.props });
+    return this.state.hasError ? this.props.children : /* @__PURE__ */ l(ie, { ...this.props });
   }
 }
 export {
-  Ae as StreamLayerPauseAd
+  ye as StreamLayerPauseAd
 };

package/lib/es/useStreamLayerApp2.js

@@ -8321,7 +8321,7 @@ const aR = ({
         p = !0;
       };
     const W = zb(e, n, l, {
-      version: "1.21.0",
+      version: "1.21.1",
       onDeepLinkHandled: o,
       videoPlayerController: i,
       onContentActivate: a,