import { jsx as s, jsxs as w } from "react/jsx-runtime";
import { h as N } from "./index7.js";
import { s as d, u as j, c as q } from "./sl-types.js";
import { d as V } from "./index11.js";
import { useState as B, useRef as E, useCallback as _, useEffect as c, Component as z } from "react";
import { e as C } from "./index5.js";
import { B as K, z as G } from "./hooks-WfHlJH12.js";
const O = /* @__PURE__ */ d("div")({
  name: "PauseAdOverlay",
  class: "pw9gih8",
  propsAsIs: !1
}), W = /* @__PURE__ */ d("div")({
  name: "PauseAdContent",
  class: "p8lpomy",
  propsAsIs: !1
}), X = /* @__PURE__ */ d("div")({
  name: "PauseAdTopLeft",
  class: "pv7u167",
  propsAsIs: !1
}), H = /* @__PURE__ */ d("h2")({
  name: "PauseAdTitle",
  class: "p1kh2yb0",
  propsAsIs: !1
}), J = /* @__PURE__ */ d("p")({
  name: "PauseAdCaption",
  class: "pl8f94x",
  propsAsIs: !1
}), Q = /* @__PURE__ */ d("div")({
  name: "PauseAdBottomLeft",
  class: "p1m6zmrt",
  propsAsIs: !1
}), Y = /* @__PURE__ */ d("button")({
  name: "PauseAdPlayButton",
  class: "pm3vwfa",
  propsAsIs: !1
}), Z = /* @__PURE__ */ d("div")({
  name: "PauseAdSidebarGradient",
  class: "p1tibuhw",
  propsAsIs: !1
}), $ = /* @__PURE__ */ d("div")({
  name: "PauseAdSidebar",
  class: "ptqqrqd",
  propsAsIs: !1
}), ee = /* @__PURE__ */ d("span")({
  name: "PauseAdTitleDescription",
  class: "p14estxv",
  propsAsIs: !1
}), F = /* @__PURE__ */ d("img")({
  name: "ExternalAdContainer",
  class: "e1dpvfl1",
  propsAsIs: !1
}), re = ({
  vastUrl: i,
  isDesktop: n,
  content: e
}) => (c(() => {
  e.imageSrc && e.id && C.emit("exposedPauseAd", {
    action: "rendered",
    payload: {
      id: e.id,
      parentId: e.parentId
    }
  });
}, [e, i]), e != null && e.imageSrc ? !e.adUrl || !n ? /* @__PURE__ */ s(F, { src: e.imageSrc }) : /* @__PURE__ */ s(
  "a",
  {
    onClick: () => {
      C.emit("exposedPauseAd", {
        action: "navigated",
        payload: {
          id: e.id,
          parentId: e.parentId
        }
      });
    },
    href: e.adUrl,
    target: "_blank",
    rel: "noopener noreferrer",
    children: /* @__PURE__ */ s(F, { src: e.imageSrc })
  }
) : null), te = ({ isClosing: i, content: n, externalPauseAdStore: e, title: I, caption: v, onPlay: u, onClose: a, vastUrl: t, options: f, isDesktop: l }) => {
  const b = (f == null ? void 0 : f.showPauseButton) ?? !0, { ref: p, focusSelf: g } = V.useFocusable({
    focusKey: "sl-pause-ad-play",
    onEnterRelease: u,
    isFocusBoundary: !0,
    forceFocus: !0
  });
  return c(() => () => {
    e.revalidate();
  }, [e]), c(() => {
    p.current && g();
  }, [p, g]), c(() => {
    if (!a)
      return () => {
      };
    const T = (A) => {
      const o = A.keyCode;
      if (o === 461 || o === 10009 || o === 27 || o === 8) {
        A.preventDefault(), A.stopPropagation(), A.stopImmediatePropagation(), a();
        return;
      }
    };
    return window.addEventListener("keydown", T, { capture: !0 }), () => window.removeEventListener("keydown", T, { capture: !0 });
  }, [a]), /* @__PURE__ */ s(O, { className: q("SL_PauseAd", i && "pause-ad-closing"), children: /* @__PURE__ */ w(W, { children: [
    /* @__PURE__ */ w(X, { children: [
      /* @__PURE__ */ s(H, { children: I }),
      /* @__PURE__ */ s(J, { children: v })
    ] }),
    b && /* @__PURE__ */ s(Q, { children: /* @__PURE__ */ s(
      Y,
      {
        ref: p,
        onClick: u,
        onMouseEnter: () => p.current.focus(),
        "aria-label": "Resume playback"
      }
    ) }),
    /* @__PURE__ */ s(Z, { className: "SL_PauseAdSidebar", children: /* @__PURE__ */ w($, { children: [
      t && /* @__PURE__ */ s(re, { content: n, isDesktop: l, vastUrl: t }),
      /* @__PURE__ */ s(ee, { children: "ADVERTISEMENT" })
    ] }) })
  ] }) });
}, se = ({ showPauseAd: i, vastUrls: n, title: e, caption: I, sdk: v, onClose: u, onRender: a, options: t, isDesktop: f }) => {
  const l = (t == null ? void 0 : t.pauseAdDelay) ?? 0, b = (t == null ? void 0 : t.pauseAdRefetchInterval) ?? 1e3 * 60 * 50, [p, g] = B(!1), [T, A] = B(!1), o = E(), h = n == null ? void 0 : n[0].url, P = E(h), y = E(""), S = E("");
  P.current = h;
  const [m, R] = v.advertisement.getExternalPauseAd(h, {
    refetchInterval: b,
    $enabled: l === 0 || !!i,
    prefetch: l === 0 && b > 0
  }), k = j(m), x = _(() => {
    if (u) {
      S.current = P.current;
      const r = m.get().data;
      C.emit("exposedPauseAd", {
        action: "closed",
        payload: (r == null ? void 0 : r.url) === S.current ? {
          id: r == null ? void 0 : r.id,
          parentId: r == null ? void 0 : r.parentId
        } : {}
      }), u();
    }
  }, [u, m]), M = _(() => {
    v.controlVideoPlayer({ play: !0 });
  }, [v]);
  return c(() => {
    R === P.current && k.error && (console.log("error", k.error), clearTimeout(o.current), x == null || x());
  }, [k, x, R]), c(() => {
    if (i && h) {
      y.current = P.current, S.current = "";
      const r = m.get().data;
      C.emit("exposedPauseAd", {
        action: "enabled",
        payload: (r == null ? void 0 : r.url) === y.current ? {
          id: r == null ? void 0 : r.id,
          parentId: r == null ? void 0 : r.parentId
        } : {}
      });
      const U = () => {
        const L = m.get(), D = L.data;
        (D == null ? void 0 : D.url) === P.current && (!L.loading && D != null && D.imageSrc ? (clearTimeout(o.current), A(!1), g(!0)) : L.loading && (o.current = setTimeout(() => {
          console.log("checkAndAllowRender timeout"), U();
        }, 200)));
      };
      clearTimeout(o.current), o.current = setTimeout(() => {
        U();
      }, l);
    } else {
      if (S.current !== P.current) {
        const r = m.get().data;
        S.current = "", y.current !== "" && (C.emit("exposedPauseAd", {
          action: "disabled",
          payload: y.current === (r == null ? void 0 : r.url) ? {
            id: r == null ? void 0 : r.id,
            parentId: r == null ? void 0 : r.parentId
          } : {}
        }), y.current = "");
      }
      A(!0), o.current = setTimeout(() => {
        g(!1);
      }, 400);
    }
    return () => {
      o.current && clearTimeout(o.current);
    };
  }, [m, x, l, i, h]), c(() => {
    a == null || a({ rendered: p });
  }, [p, a]), c(() => () => {
    a == null || a({ rendered: !1 });
  }, [a]), !p || !k.data ? null : /* @__PURE__ */ s(
    te,
    {
      onClose: x,
      isClosing: T,
      title: e,
      caption: I,
      onPlay: M,
      vastUrl: h,
      options: t,
      isDesktop: f,
      externalPauseAdStore: m,
      content: k.data
    }
  );
}, ne = ({
  showPauseAd: i,
  pauseAdVastUrl: n,
  videoPlayerController: e,
  onRenderPauseAd: I,
  onClosePauseAd: v,
  children: u,
  options: a
}) => {
  const t = K(), f = G(), l = E();
  return c(() => t ? (e && (l.current = e, t.addVideoPlayerController(l.current)), () => {
    l.current && t.removeVideoPlayerController(l.current);
  }) : () => {
  }, [t, e]), t ? /* @__PURE__ */ s("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ w(
    N,
    {
      style: u ? { position: "relative" } : {},
      customTheme: f.theme,
      themeMode: f.themeMode,
      children: [
        u,
        n && /* @__PURE__ */ s(
          se,
          {
            sdk: t,
            showPauseAd: i,
            vastUrls: n,
            onClose: v,
            onRender: I,
            options: a,
            isDesktop: !0
          }
        )
      ]
    }
  ) }) : u;
};
class pe extends z {
  constructor(n) {
    super(n), this.state = { hasError: !1 };
  }
  static getDerivedStateFromError() {
    return { hasError: !0 };
  }
  componentDidCatch(n, e) {
    console.error(n, e.componentStack);
  }
  render() {
    return this.state.hasError ? this.props.children : /* @__PURE__ */ s(ne, { ...this.props });
  }
}
export {
  pe as StreamLayerPauseAd
};
