@streamlayer/react 0.39.1 → 0.40.0

package/lib/es/index2.js

@@ -1,25 +1,28 @@
-import { jsx as a } from "react/jsx-runtime";
-import { createContext as S, useMemo as d } from "react";
-import { useStreamLayerApp as G } from "./useStreamLayerApp.js";
-var O = /* @__PURE__ */ ((R) => (R[R.UNSET = 0] = "UNSET", R[R.CONNECTED = 1] = "CONNECTED", R[R.READY = 2] = "READY", R))(O || {});
-const D = S({
+import { jsx as T } from "react/jsx-runtime";
+import { createContext as G, useMemo as d, useEffect as O } from "react";
+import { useStreamLayerApp as c } from "./useStreamLayerApp.js";
+var f = /* @__PURE__ */ ((R) => (R[R.UNSET = 0] = "UNSET", R[R.CONNECTED = 1] = "CONNECTED", R[R.READY = 2] = "READY", R))(f || {});
+const B = G({
   status: 0,
   sdk: null
-}), I = ({
+}), P = ({
   sdkKey: R,
   plugins: E,
-  children: e,
-  production: _ = !0,
+  children: A,
+  production: n = !0,
   autoEnable: s = !0,
-  onDeepLinkHandled: N
+  onDeepLinkHandled: _,
+  videoPlayerController: r
 }) => {
-  const A = G(R, E, _, s), i = d(() => A ? (N && A.onDeepLinkHandled(N), {
-    sdk: A,
+  const e = c(R, E, n, s), S = d(() => e ? (r && e.addVideoPlayerController(r), _ && e.addDeepLinkHandler(_), {
+    sdk: e,
     status: 2
     /* READY */
-  }) : { status: 1, sdk: null }, [A]);
-  return /* @__PURE__ */ a(D.Provider, { value: i, children: e });
-}, c = {
+  }) : { status: 1, sdk: null }, [e]);
+  return O(() => () => {
+    _ && (e == null || e.removeDeepLinkHandler(_)), r && (e == null || e.removeVideoPlayerController(r));
+  }, [e]), /* @__PURE__ */ T(B.Provider, { value: S, children: A });
+}, D = {
   BG_TRANSPARENT: "rgba(0,0,0, .8)",
   BG_TRANSPARENT_VOTE_CONTAINER: "rgba(10, 14, 19, 0.8)",
   BG_TRANSPARENT_ITEM: "rgba(0, 0, 0, 0.7)",
@@ -48,7 +51,7 @@ const D = S({
   GREY_PRIMARY: "#909395",
   DIVIDER_COLOR_SECONDARY: "#53565a",
   GREEN_PRIMARY_BTN: "#009B77"
-}, B = {
+}, Y = {
   PRIMARY_GREEN1: "#107D57",
   PRIMARY_GREEN2: "#006747",
   PRIMARY_GREEN3: "#1C4932",
@@ -70,65 +73,65 @@ const D = S({
   NEUTRALS_GRAY8: "#53565A",
   NEUTRALS_GRAY9: "#25282A",
   NEUTRALS_BLACK: "#000000"
-}, o = Object.assign({}, c, B), t = {
+}, o = Object.assign({}, D, Y), t = {
   REGULAR: "'Benton Sans', BentonSans, Arial, Helvetica, sans-serif",
   SERIF: "'Tiempos', 'Tiempos Text', Times New Roman, serif",
   COLOR: "#fff",
   WEIGHT_DEFAULT: "500"
-}, r = {
+}, N = {
   xs: 324,
   sm: 576,
   md: 768,
   lg: 992,
   xl: 1215,
   xxl: 1440
-}, Y = {
+}, C = {
   landscape: "landscape",
   portrait: "portrait"
 }, l = Object.keys(o).reduce((R, E) => {
-  const e = o[E];
+  const A = o[E];
   return `
     ${R}
-    --color-${E.toLowerCase().replaceAll("_", "-")}: ${e};
+    --color-${E.toLowerCase().replaceAll("_", "-")}: ${A};
   `;
-}, ""), n = (R) => (E) => `
+}, ""), a = (R) => (E) => `
   @media only screen and (${R}) {
     ${E}
   }
-`, C = (R, E) => (e) => `
+`, p = (R, E) => (A) => `
   @media only screen and (${R}) and (${E}) {
-    ${e}
+    ${A}
   }
-`, T = {
+`, i = {
   up: (R) => {
-    const E = r[R];
-    return n(`min-width: ${E}px`);
+    const E = N[R];
+    return a(`min-width: ${E}px`);
   },
   down: (R) => {
-    const E = r[R] - 1;
-    return n(`max-width: ${E}px`);
+    const E = N[R] - 1;
+    return a(`max-width: ${E}px`);
   },
   intermediate: (R, E) => {
-    const e = r[R] - 1, _ = r[E];
-    return C(`max-width: ${e}px`, `min-width: ${_}px`);
+    const A = N[R] - 1, n = N[E];
+    return p(`max-width: ${A}px`, `min-width: ${n}px`);
   },
   orientation: (R) => {
-    const E = Y[R];
-    return n(`orientation: ${E}`);
+    const E = C[R];
+    return a(`orientation: ${E}`);
   }
 };
-`${l}${t.REGULAR}${t.REGULAR}${t.COLOR}${t.SERIF}${t.WEIGHT_DEFAULT}${T.down("xl")`
+`${l}${t.REGULAR}${t.REGULAR}${t.COLOR}${t.SERIF}${t.WEIGHT_DEFAULT}${i.down("xl")`
     --header-offset: 56px;
-  `}${T.intermediate("xl", "lg")`
+  `}${i.intermediate("xl", "lg")`
     --header-offset: 76px;
   `}`;
-const x = "StreamLayerCSSReset", f = "ttkj0ah", L = ({ children: R, style: E }) => /* @__PURE__ */ a("div", { className: "StreamLayerSDKTheme", children: /* @__PURE__ */ a("div", { className: f, style: E, children: R }) });
+const U = "StreamLayerCSSReset", F = "ttkj0ah", u = ({ children: R, style: E }) => /* @__PURE__ */ T("div", { className: "StreamLayerSDKTheme", children: /* @__PURE__ */ T("div", { className: F, style: E, children: R }) });
 export {
   o as E,
-  r as O,
-  I as S,
-  D as a,
-  O as b,
-  x as m,
-  L as p
+  N as O,
+  P as S,
+  B as a,
+  f as b,
+  U as m,
+  u as p
 };