@streamlayer/react-ui 1.30.0 → 1.31.1

package/lib/app/webos/Advertisement/index.js

@@ -1,72 +1,87 @@
-import { jsxs as T, jsx as P } from "react/jsx-runtime";
+import { jsx as u, jsxs as $ } from "react/jsx-runtime";
 import { cx as V } from "@linaria/core";
-import { styled as x } from "@linaria/react";
-import { useAnalyticsListener as F } from "../../../hooks/analytics.js";
-import { useHideTransition as M } from "../../../hooks/showIn.js";
-import { forwardRef as O, useEffect as B, useRef as j } from "react";
-import { useStore as u } from "@streamlayer/react-polyfills";
-import { eventBus as E } from "@streamlayer/sdk-web-interfaces";
-import { PromotionType as q, FeatureType as D } from "@streamlayer/sdk-web-types";
-import { useAdvertisementBackground as H } from "../../../ui/theme/utils.js";
-import { AdvertisementUI as K } from "./AdvertisementUI.js";
-const N = /* @__PURE__ */ x("div")({
+import { styled as j } from "@linaria/react";
+import { StreamLayerSDKBannerProvider as q } from "../../app/Banner/index.js";
+import { useAnalyticsListener as H } from "../../../hooks/analytics.js";
+import { useHideTransition as Q } from "../../../hooks/showIn.js";
+import { forwardRef as G, useEffect as _, useRef as z } from "react";
+import { useStore as d } from "@streamlayer/react-polyfills";
+import { eventBus as x } from "@streamlayer/sdk-web-interfaces";
+import { QuestionPosition as C, AdUnit as J, PromotionType as X, FeatureType as Y } from "@streamlayer/sdk-web-types";
+import { useAdvertisementBackground as Z } from "../../../ui/theme/utils.js";
+import { AdvertisementUI as ee } from "./AdvertisementUI.js";
+const D = /* @__PURE__ */ j("div")({
   name: "AdvertisementUIWrap",
   class: "a17b2u9w",
   propsAsIs: !1
-}), R = (t) => {
+}), te = (t) => {
   const r = t.target;
   if (r instanceof HTMLAnchorElement && r.target === "_blank") {
-    const o = r.getAttribute("data-promo-id") || "", a = r.getAttribute("data-promo-type") || q.UNSET;
-    r.getAttribute("data-a") === "button" && E.emit("advertisement", {
+    const n = r.getAttribute("data-promo-id") || "", a = r.getAttribute("data-promo-type") || X.UNSET;
+    r.getAttribute("data-a") === "button" && x.emit("advertisement", {
       action: "buttonSelect",
       payload: {
-        id: o,
+        id: n,
         type: a
       }
-    }), r.getAttribute("data-a") === "banner" && E.emit("advertisement", {
+    }), r.getAttribute("data-a") === "banner" && x.emit("advertisement", {
       action: "bannerSelect",
       payload: {
-        id: o,
+        id: n,
         type: a
       }
     });
   }
-}, G = O(({
+}, re = G(({
   gamification: t,
   skipAutoClose: r,
-  containerId: o,
+  containerId: n,
   muted: a,
-  notification: n,
-  sidebar: s,
+  notification: m,
+  sidebar: l,
   banner: i,
-  persistent: m,
-  controlVideo: l
-}, d) => {
-  var p, f, g, v, A, b, S, y, U, I;
-  const e = u(t.advertisement.$store), {
-    finished: c
-  } = M();
-  F(d, {
+  persistent: c,
+  controlVideo: p
+}, s) => {
+  var g, A, S, b, U, y, I, L, P, h, W, k, w, E, T, B;
+  const e = d(t.advertisement.$store), o = d(t.openedQuestion.$store), f = d(t.openedQuestion.$extendedStore), {
+    finished: v
+  } = Q();
+  H(s, {
     enabled: !!e.data,
     event: "click",
-    listener: R
-  }), B(() => {
-    var L;
-    c && ((L = e.close) == null || L.call(e));
-  }, [c]);
-  const k = !i && !s, W = ((g = (f = (p = e.data) == null ? void 0 : p.question) == null ? void 0 : f.backgroundImage) == null ? void 0 : g.landscapeUrl) || ((A = (v = e.data) == null ? void 0 : v.promotion) == null ? void 0 : A.backgroundImageLandscapeUrl), h = ((y = (S = (b = e.data) == null ? void 0 : b.question) == null ? void 0 : S.backgroundImage) == null ? void 0 : y.portraitUrl) || ((I = (U = e.data) == null ? void 0 : U.promotion) == null ? void 0 : I.backgroundImagePortraitUrl), w = H({
-    containerId: o,
-    landscapeUrl: W,
-    portraitUrl: h
-  });
-  return e.data === void 0 || !m && e.isViewed ? null : /* @__PURE__ */ T(N, {
-    ref: d,
+    listener: te
+  }), _(() => {
+    var O;
+    v && ((O = e.close) == null || O.call(e));
+  }, [v]);
+  const F = !i && !l, M = ((S = (A = (g = e.data) == null ? void 0 : g.question) == null ? void 0 : A.backgroundImage) == null ? void 0 : S.landscapeUrl) || ((U = (b = e.data) == null ? void 0 : b.promotion) == null ? void 0 : U.backgroundImageLandscapeUrl), R = ((L = (I = (y = e.data) == null ? void 0 : y.question) == null ? void 0 : I.backgroundImage) == null ? void 0 : L.portraitUrl) || ((h = (P = e.data) == null ? void 0 : P.promotion) == null ? void 0 : h.backgroundImagePortraitUrl), K = Z({
+    containerId: n,
+    landscapeUrl: M,
+    portraitUrl: R
+  }), N = ((k = (W = f == null ? void 0 : f.data) == null ? void 0 : W.appearance) == null ? void 0 : k.position) === C.LBAR;
+  return i && e.data === void 0 && ((w = o == null ? void 0 : o.attributes) == null ? void 0 : w.adUnit) === J.STANDART && N && ((B = (T = (E = o == null ? void 0 : o.attributes) == null ? void 0 : E.adPromotion) == null ? void 0 : T.banner) != null && B.imageUrl) ? /* @__PURE__ */ u(D, {
+    ref: s,
+    style: {
+      height: "100%"
+    },
+    className: V("SL-AdvertisementUIWrap", "SL-AdvertisementWebOs", "SL-AdvertisementUIWrap--lower-third"),
+    children: /* @__PURE__ */ u(q, {
+      cardId: o.id,
+      promotion: {
+        ...o.attributes.adPromotion,
+        adUnit: o.attributes.adUnit
+      },
+      direction: i
+    })
+  }) : e.data === void 0 || !c && e.isViewed ? null : /* @__PURE__ */ $(D, {
+    ref: s,
     style: {
-      height: k ? "auto" : "100%"
+      height: F ? "auto" : "100%"
     },
     className: V("SL-AdvertisementUIWrap", "SL-AdvertisementWebOs", "SL-AdvertisementUIWrap--lower-third"),
-    children: [!n && w, /* @__PURE__ */ P(K, {
-      sidebar: s,
+    children: [!m && K, /* @__PURE__ */ u(ee, {
+      sidebar: l,
       banner: i,
       advertisement: e.data,
       advertisementPaused: !!e.isPaused,
@@ -79,40 +94,40 @@ const N = /* @__PURE__ */ x("div")({
       fireEvent: e.fireEvent,
       markAsViewed: t.advertisement.markAsViewed,
       open: t.advertisement.open,
-      isNotification: n,
+      isNotification: m,
       skipAutoClose: r,
-      controlVideo: l,
+      controlVideo: p,
       muted: a
     })]
   });
-}), re = ({
+}), ge = ({
   sdk: t,
   sidebar: r,
-  muted: o,
+  muted: n,
   banner: a,
-  skipAutoClose: n,
-  persistent: s,
+  skipAutoClose: m,
+  persistent: l,
   notification: i
 }) => {
   const {
-    containerId: m
-  } = u(t.options), l = u(t.featuresList.getStore()), d = j(null);
-  if (!l)
+    containerId: c
+  } = d(t.options), p = d(t.featuresList.getStore()), s = z(null);
+  if (!p)
     return null;
-  const e = t.getFeature(D.GAMES);
-  return e != null && e.advertisement ? /* @__PURE__ */ P(G, {
-    ref: d,
+  const e = t.getFeature(Y.GAMES);
+  return e != null && e.advertisement ? /* @__PURE__ */ u(re, {
+    ref: s,
     gamification: e,
     sidebar: r,
     banner: a,
-    persistent: s,
-    skipAutoClose: n,
-    muted: o,
+    persistent: l,
+    skipAutoClose: m,
+    muted: n,
     notification: i,
-    containerId: m,
+    containerId: c,
     controlVideo: t.controlVideoPlayer
   }) : null;
 };
 export {
-  re as StreamLayerSDKAdvertisementWebOS
+  ge as StreamLayerSDKAdvertisementWebOS
 };

package/lib/app/webos/Question/index.js

@@ -1,29 +1,32 @@
 import { jsx as n } from "react/jsx-runtime";
-import { styled as I } from "@linaria/react";
-import { Question as b } from "../../app/Features/Gamification/Question.js";
-import { useHideTransition as h } from "../../../hooks/showIn.js";
-import { useState as q, useMemo as w, useEffect as d } from "react";
-import { useStore as l } from "@streamlayer/react-polyfills";
-import { eventBus as C } from "@streamlayer/sdk-web-interfaces";
-import { FeatureType as x, AdUnit as E } from "@streamlayer/sdk-web-types";
-import { InAppNotification as O } from "../../../ui/gamification/question/inapp/notification/AdNotification/index.js";
-import { ShowIn as Q } from "../../../ui/show-in/index.js";
-const j = () => Q, D = /* @__PURE__ */ I(j())({
+import { styled as N } from "@linaria/react";
+import { Question as O } from "../../app/Features/Gamification/Question.js";
+import { useHideTransition as R } from "../../../hooks/showIn.js";
+import { useState as g, useMemo as C, useEffect as l } from "react";
+import { useStore as A } from "@streamlayer/react-polyfills";
+import { eventBus as D } from "@streamlayer/sdk-web-interfaces";
+import { NotificationType as Q } from "@streamlayer/sdk-web-notifications";
+import { FeatureType as b, QuestionType as h, AdUnit as S } from "@streamlayer/sdk-web-types";
+import { InAppNotification as w } from "../../../ui/gamification/question/inapp/notification/AdNotification/index.js";
+import { InAppPredictionResult as U } from "../../../ui/gamification/question/inapp/prediction-result/index.js";
+import { InAppPredictionResultAd as x } from "../../../ui/gamification/question/inapp/prediction-result-ad/index.js";
+import { ShowIn as L } from "../../../ui/show-in/index.js";
+const P = () => L, j = /* @__PURE__ */ N(P())({
   name: "OpenedContainer",
   class: "osyjgip",
   propsAsIs: !0
-}), W = ({
-  sdk: e,
-  notification: r
+}), Z = ({
+  sdk: o,
+  notification: i
 }) => {
-  var s, a, p, u, m, f, c;
-  const A = l(e.featuresList.getStore()), {
-    hiding: S,
-    onAnimationEnd: y,
-    finished: i
-  } = h(), [T] = q(e.getNotificationsStore()), g = l(T), t = w(() => e.getActiveNotification(), [e, g]);
-  d(() => {
-    t && C.emit("notification", {
+  var a, s, p, u, c, m, f, d;
+  const T = A(o.featuresList.getStore()), {
+    hiding: y,
+    onAnimationEnd: I,
+    finished: r
+  } = R(), [q] = g(o.getNotificationsStore()), E = A(q), t = C(() => o.getActiveNotification(), [o, E]);
+  l(() => {
+    t && D.emit("notification", {
       action: "rendered",
       payload: {
         questionId: t.data.questionId,
@@ -31,26 +34,35 @@ const j = () => Q, D = /* @__PURE__ */ I(j())({
       }
     });
   }, [t]);
-  const o = e.getFeature(x.GAMES);
-  return d(() => {
-    i && (o == null || o.closeQuestion());
-  }, [i, o]), !A || !o ? null : r && t && ((s = t.data.inApp) == null ? void 0 : s.adUnit) === E.STANDART ? /* @__PURE__ */ n(O, {
+  const e = o.getFeature(b.GAMES);
+  return l(() => {
+    r && (e == null || e.closeQuestion());
+  }, [r, e]), !T || !e ? null : i && t && t.type === Q.QUESTION_RESOLVED && t.data.questionType === h.PREDICTION && t.data.question ? ((a = t.data.inApp) == null ? void 0 : a.adUnit) === S.STANDART ? /* @__PURE__ */ n(x, {
+    action: t.action,
+    close: t.close,
+    ...t.data.question,
+    inApp: t.data.inApp
+  }) : /* @__PURE__ */ n(U, {
+    action: t.action,
+    close: t.close,
+    ...t.data.question
+  }) : i && t && ((s = t.data.inApp) == null ? void 0 : s.adUnit) === S.STANDART ? /* @__PURE__ */ n(w, {
     ...t.data,
     action: t.action,
     close: t.close,
-    color: ((u = (p = (a = t == null ? void 0 : t.data) == null ? void 0 : a.inApp) == null ? void 0 : p.notification) == null ? void 0 : u.indicatorColor) || ((c = (f = (m = t == null ? void 0 : t.data) == null ? void 0 : m.inApp) == null ? void 0 : f.appearance) == null ? void 0 : c.primaryColor) || "",
+    color: ((c = (u = (p = t == null ? void 0 : t.data) == null ? void 0 : p.inApp) == null ? void 0 : u.notification) == null ? void 0 : c.indicatorColor) || ((d = (f = (m = t == null ? void 0 : t.data) == null ? void 0 : m.inApp) == null ? void 0 : f.appearance) == null ? void 0 : d.primaryColor) || "",
     webos: !0
-  }) : r ? null : /* @__PURE__ */ n(D, {
-    hiding: S,
-    onAnimationEnd: y,
-    children: /* @__PURE__ */ n(b, {
-      sdk: e,
-      gamification: o,
+  }) : i ? null : /* @__PURE__ */ n(j, {
+    hiding: y,
+    onAnimationEnd: I,
+    children: /* @__PURE__ */ n(O, {
+      sdk: o,
+      gamification: e,
       className: "webos",
       webos: !0
     })
   });
 };
 export {
-  W as StreamLayerSDKQuestionWebOS
+  Z as StreamLayerSDKQuestionWebOS
 };