@streamlayer/react 1.20.5 → 1.20.6

package/lib/es/pause-ad.js

@@ -1,20 +1,20 @@
-import { jsx as n, jsxs as I } from "react/jsx-runtime";
-import { c as K, i as V, s as p, e as x, f as F, j as M, a as _, u as j, b as q, h as z } from "./provider.js";
-import { useRef as L, useCallback as C, useState as R, useEffect as b, Component as G } from "react";
+import { jsx as a, jsxs as I } from "react/jsx-runtime";
+import { c as K, i as V, s as p, e as L, f as F, j as M, a as _, u as $, b as j, h as q } from "./provider.js";
+import { useRef as x, useCallback as C, useState as R, useEffect as b, Component as z } from "react";
 import { c as N } from "./vast-client.min-B0NUra1B.js";
-const H = {}, O = new N(), w = V(H), E = K("ui:gam-static"), U = (r) => new Promise((e, a) => {
+const G = {}, H = new N(), w = V(G), E = K("ui:gam-static"), U = (r) => new Promise((e, t) => {
   const s = new Image();
-  s.onload = () => e(r), s.onerror = () => a(), s.src = r;
+  s.onload = () => e(r), s.onerror = () => t(), s.src = r;
 }), D = () => {
-  const r = L(0);
+  const r = x(0);
   return [C(async (e) => {
-    var a, s, c, o, l, t, u, i, f, m, h;
-    if ((a = w.get()[e]) != null && a.imageSrc)
+    var t, s, c, o, l, n, u, i, h, m, f;
+    if ((t = w.get()[e]) != null && t.imageSrc)
       return { success: !0 };
     const v = Date.now();
     r.current = v, w.setKey(e, { url: e });
     try {
-      const d = await O.get(e);
+      const d = await H.get(e);
       if (E.debug(d, "parsedVAST"), r.current === v && w.get()[e].url) {
         const y = d.ads.find((g) => g.creatives.length > 0);
         if (y) {
@@ -28,7 +28,7 @@ const H = {}, O = new N(), w = V(H), E = K("ui:gam-static"), U = (r) => new Prom
           }
           const A = y.creatives.find((S) => S.type === "companion");
           E.debug(A, "companion");
-          const T = (f = (i = (u = (t = A == null ? void 0 : A.variations) == null ? void 0 : t[0]) == null ? void 0 : u.staticResources) == null ? void 0 : i[0]) == null ? void 0 : f.url, P = (h = (m = A == null ? void 0 : A.variations) == null ? void 0 : m[0]) == null ? void 0 : h.companionClickThroughURLTemplate;
+          const T = (h = (i = (u = (n = A == null ? void 0 : A.variations) == null ? void 0 : n[0]) == null ? void 0 : u.staticResources) == null ? void 0 : i[0]) == null ? void 0 : h.url, P = (f = (m = A == null ? void 0 : A.variations) == null ? void 0 : m[0]) == null ? void 0 : f.companionClickThroughURLTemplate;
           if (T)
             return await U(T), w.setKey(e, { url: e, imageSrc: T, adUrl: P }), { success: !0 };
         }
@@ -38,60 +38,60 @@ const H = {}, O = new N(), w = V(H), E = K("ui:gam-static"), U = (r) => new Prom
     }
     return { success: !1 };
   }, []), w];
-}, J = /* @__PURE__ */ p("div")({
+}, O = /* @__PURE__ */ p("div")({
   name: "PauseAdOverlay",
   class: "pw9gih8",
   propsAsIs: !1
-}), Q = /* @__PURE__ */ p("div")({
+}), J = /* @__PURE__ */ p("div")({
   name: "PauseAdContent",
   class: "p8lpomy",
   propsAsIs: !1
-}), W = /* @__PURE__ */ p("div")({
-  name: "PauseAdGradientLeft",
+}), Q = /* @__PURE__ */ p("div")({
+  name: "PauseAdGradientRight",
   class: "pv7u167",
   propsAsIs: !1
-}), X = /* @__PURE__ */ p("div")({
-  name: "PauseAdGradientRight",
+}), W = /* @__PURE__ */ p("div")({
+  name: "PauseAdGradientBottom",
   class: "p1kh2yb0",
   propsAsIs: !1
-}), Y = /* @__PURE__ */ p("div")({
-  name: "PauseAdGradientBottom",
+}), X = /* @__PURE__ */ p("div")({
+  name: "PauseAdTopLeft",
   class: "pl8f94x",
   propsAsIs: !1
-}), Z = /* @__PURE__ */ p("div")({
-  name: "PauseAdTopLeft",
+}), Y = /* @__PURE__ */ p("h2")({
+  name: "PauseAdTitle",
   class: "p1m6zmrt",
   propsAsIs: !1
-}), $ = /* @__PURE__ */ p("h2")({
-  name: "PauseAdTitle",
+}), Z = /* @__PURE__ */ p("p")({
+  name: "PauseAdCaption",
   class: "pm3vwfa",
   propsAsIs: !1
-}), ee = /* @__PURE__ */ p("p")({
-  name: "PauseAdCaption",
+}), ee = /* @__PURE__ */ p("div")({
+  name: "PauseAdBottomLeft",
   class: "p1tibuhw",
   propsAsIs: !1
-}), re = /* @__PURE__ */ p("div")({
-  name: "PauseAdBottomLeft",
+}), re = /* @__PURE__ */ p("button")({
+  name: "PauseAdPlayButton",
   class: "ptqqrqd",
   propsAsIs: !1
-}), se = /* @__PURE__ */ p("button")({
-  name: "PauseAdPlayButton",
+}), se = /* @__PURE__ */ p("div")({
+  name: "PauseAdSidebar",
   class: "p14estxv",
   propsAsIs: !1
-}), te = /* @__PURE__ */ p("div")({
-  name: "PauseAdSidebar",
+}), ne = /* @__PURE__ */ p("span")({
+  name: "PauseAdTitleDescription",
   class: "p1dpvfl1",
   propsAsIs: !1
 }), k = /* @__PURE__ */ p("img")({
   name: "ExternalAdContainer",
   class: "ezfmabr",
   propsAsIs: !1
-}), ne = ({ vastUrl: r }) => {
+}), te = ({ vastUrl: r }) => {
   var e;
-  const [, a] = D(), s = _(a, { keys: [r] });
-  return (e = s == null ? void 0 : s[r]) != null && e.imageSrc ? s[r].adUrl ? /* @__PURE__ */ n("a", { href: s[r].adUrl, target: "_blank", rel: "noopener noreferrer", children: /* @__PURE__ */ n(k, { src: s[r].imageSrc }) }) : /* @__PURE__ */ n(k, { src: s[r].imageSrc }) : null;
-}, ae = ({ isClosing: r, title: e, caption: a, onPlay: s, onClose: c, vastUrl: o, options: l }) => {
-  const t = (l == null ? void 0 : l.showPauseButton) ?? !0, { ref: u, focusSelf: i } = F.useFocusable({
+  const [, t] = D(), s = _(t, { keys: [r] });
+  return (e = s == null ? void 0 : s[r]) != null && e.imageSrc ? s[r].adUrl ? /* @__PURE__ */ a("a", { href: s[r].adUrl, target: "_blank", rel: "noopener noreferrer", children: /* @__PURE__ */ a(k, { src: s[r].imageSrc }) }) : /* @__PURE__ */ a(k, { src: s[r].imageSrc }) : null;
+}, ae = ({ isClosing: r, title: e, caption: t, onPlay: s, onClose: c, vastUrl: o, options: l }) => {
+  const n = (l == null ? void 0 : l.showPauseButton) ?? !0, { ref: u, focusSelf: i } = F.useFocusable({
     focusKey: "sl-pause-ad-play",
     onEnterRelease: s,
     isFocusBoundary: !0,
@@ -100,24 +100,23 @@ const H = {}, O = new N(), w = V(H), E = K("ui:gam-static"), U = (r) => new Prom
   return b(() => {
     u.current && i();
   }, [u, i]), b(() => {
-    const f = (m) => {
-      const h = m.keyCode;
-      if (h === 461 || h === 10009 || h === 27) {
+    const h = (m) => {
+      const f = m.keyCode;
+      if (f === 461 || f === 10009 || f === 27 || f === 8) {
         m.preventDefault(), m.stopPropagation(), m.stopImmediatePropagation(), c == null || c();
         return;
       }
     };
-    return window.addEventListener("keydown", f, { capture: !0 }), () => window.removeEventListener("keydown", f, { capture: !0 });
-  }, [c]), /* @__PURE__ */ n(J, { className: M(r && "pause-ad-closing"), children: /* @__PURE__ */ I(Q, { children: [
-    /* @__PURE__ */ n(W, {}),
-    /* @__PURE__ */ n(X, {}),
-    /* @__PURE__ */ n(Y, {}),
-    /* @__PURE__ */ I(Z, { children: [
-      /* @__PURE__ */ n($, { children: e }),
-      /* @__PURE__ */ n(ee, { children: a })
+    return window.addEventListener("keydown", h, { capture: !0 }), () => window.removeEventListener("keydown", h, { capture: !0 });
+  }, [c]), /* @__PURE__ */ a(O, { className: M(r && "pause-ad-closing"), children: /* @__PURE__ */ I(J, { children: [
+    /* @__PURE__ */ a(Q, {}),
+    /* @__PURE__ */ a(W, {}),
+    /* @__PURE__ */ I(X, { children: [
+      /* @__PURE__ */ a(Y, { children: e }),
+      /* @__PURE__ */ a(Z, { children: t })
     ] }),
-    t && /* @__PURE__ */ n(re, { children: /* @__PURE__ */ n(
-      se,
+    n && /* @__PURE__ */ a(ee, { children: /* @__PURE__ */ a(
+      re,
       {
         ref: u,
         onClick: s,
@@ -125,27 +124,27 @@ const H = {}, O = new N(), w = V(H), E = K("ui:gam-static"), U = (r) => new Prom
         "aria-label": "Resume playback"
       }
     ) }),
-    /* @__PURE__ */ I(te, { children: [
-      o && /* @__PURE__ */ n(ne, { vastUrl: o }),
-      /* @__PURE__ */ n("span", { children: "ADVERTISEMENT" })
+    /* @__PURE__ */ I(se, { children: [
+      o && /* @__PURE__ */ a(te, { vastUrl: o }),
+      /* @__PURE__ */ a(ne, { children: "ADVERTISEMENT" })
     ] })
   ] }) });
 }, oe = ({
   showPauseAd: r,
   vastUrls: e,
-  title: a,
+  title: t,
   caption: s,
   onPlay: c,
   onClose: o,
   onRender: l,
-  options: t
+  options: n
 }) => {
-  const u = (t == null ? void 0 : t.pauseAdDelay) ?? 5e3, [i, f] = R(!1), [m, h] = R(!1), v = L(), d = e == null ? void 0 : e[0].url, y = L(d);
+  const u = (n == null ? void 0 : n.pauseAdDelay) ?? 5e3, [i, h] = R(!1), [m, f] = R(!1), v = x(), d = e == null ? void 0 : e[0].url, y = x(d);
   y.current = d;
   const [g, A] = D();
   return b(() => {
     if (r && d) {
-      x.emit("exposedPauseAd", {
+      L.emit("exposedPauseAd", {
         action: "enabled",
         payload: {}
       }), g(d).then((P) => {
@@ -155,7 +154,7 @@ const H = {}, O = new N(), w = V(H), E = K("ui:gam-static"), U = (r) => new Prom
       });
       const T = () => {
         var P;
-        (P = A.get()[y.current]) != null && P.imageSrc ? (clearTimeout(v.current), h(!1), f(!0), x.emit("exposedPauseAd", {
+        (P = A.get()[y.current]) != null && P.imageSrc ? (clearTimeout(v.current), f(!1), h(!0), L.emit("exposedPauseAd", {
           action: "rendered",
           payload: {}
         })) : v.current = setTimeout(() => {
@@ -166,11 +165,11 @@ const H = {}, O = new N(), w = V(H), E = K("ui:gam-static"), U = (r) => new Prom
         T();
       }, u);
     } else
-      x.emit("exposedPauseAd", {
+      L.emit("exposedPauseAd", {
         action: "disabled",
         payload: {}
-      }), h(!0), v.current = setTimeout(() => {
-        f(!1);
+      }), f(!0), v.current = setTimeout(() => {
+        h(!1);
       }, 400);
     return () => {
       v.current && clearTimeout(v.current);
@@ -179,49 +178,49 @@ const H = {}, O = new N(), w = V(H), E = K("ui:gam-static"), U = (r) => new Prom
     l == null || l({ rendered: i });
   }, [i, l]), b(() => () => {
     l == null || l({ rendered: !1 });
-  }, [l]), i ? /* @__PURE__ */ n(
+  }, [l]), i ? /* @__PURE__ */ a(
     ae,
     {
       onClose: o,
       isClosing: m,
-      title: a,
+      title: t,
       caption: s,
       onPlay: c,
       vastUrl: d,
-      options: t
+      options: n
     }
   ) : null;
 }, le = ({
   showPauseAd: r,
   pauseAdVastUrl: e,
-  videoPlayerController: a,
+  videoPlayerController: t,
   onRenderPauseAd: s,
   onClosePauseAd: c,
   children: o,
   options: l
 }) => {
-  const t = j(), u = q(), i = L(), f = C(() => {
+  const n = $(), u = j(), i = x(), h = C(() => {
     c == null || c();
   }, [c]), m = C(() => {
-    t == null || t.controlVideoPlayer({ play: !0 });
-  }, [t]);
-  return b(() => t ? (a && (i.current = a, t.addVideoPlayerController(i.current)), () => {
-    i.current && t.removeVideoPlayerController(i.current);
+    n == null || n.controlVideoPlayer({ play: !0 });
+  }, [n]);
+  return b(() => n ? (t && (i.current = t, n.addVideoPlayerController(i.current)), () => {
+    i.current && n.removeVideoPlayerController(i.current);
   }) : () => {
-  }, [t, a]), t ? /* @__PURE__ */ n("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ I(
-    z,
+  }, [n, t]), n ? /* @__PURE__ */ a("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ I(
+    q,
     {
       style: { position: "relative" },
       customTheme: u.theme,
       themeMode: u.themeMode,
       children: [
         o,
-        e && /* @__PURE__ */ n(
+        e && /* @__PURE__ */ a(
           oe,
           {
             showPauseAd: r,
             vastUrls: e,
-            onClose: f,
+            onClose: h,
             onRender: s,
             onPlay: m,
             options: l
@@ -231,18 +230,18 @@ const H = {}, O = new N(), w = V(H), E = K("ui:gam-static"), U = (r) => new Prom
     }
   ) }) : o;
 };
-class pe extends G {
+class pe extends z {
   constructor(e) {
     super(e), this.state = { hasError: !1 };
   }
   static getDerivedStateFromError() {
     return { hasError: !0 };
   }
-  componentDidCatch(e, a) {
-    console.error(e, a.componentStack);
+  componentDidCatch(e, t) {
+    console.error(e, t.componentStack);
   }
   render() {
-    return this.state.hasError ? this.props.children : /* @__PURE__ */ n(le, { ...this.props });
+    return this.state.hasError ? this.props.children : /* @__PURE__ */ a(le, { ...this.props });
   }
 }
 export {