@streamlayer/react-ui 0.96.1 → 0.96.3

package/lib/ui/app/masters.js

@@ -1,78 +1,131 @@
-import { jsx as r, jsxs as f } from "react/jsx-runtime";
-import { useRef as u, useEffect as C, useMemo as x } from "react";
-import { resetCss as v } from "../theme/theme.js";
-import { ActiveFeature as A } from "./Features/index.js";
-import { MastersNavigation as I } from "./Navigation/MastersNavigation/index.js";
-import { SDKNotifications as M } from "./Notifications/index.js";
-import { SDKContainer as B, SDKScrollContainer as F } from "./styles.js";
-import { useMastersApp as j } from "./useMastersApp.js";
-import { MastersContext as D } from "./useMastersContext.js";
-import { useSdkFeature as E } from "./useSdkFeature.js";
-import { useSdkResponsive as K } from "./useSdkResponsive.js";
-import { useSdkScroll as L } from "./useSdkScroll.js";
-import { ChannelsButtonId as O } from "../navigation/button/Channels.js";
-import { LeaderBoardButtonId as R } from "../navigation/button/LeaderBoard.js";
-import { FeaturedGroupsButtonId as T } from "../navigation/button/FeaturedGroups.js";
+import { jsx as m, jsxs as f } from "react/jsx-runtime";
+import { useStore as C } from "@nanostores/react";
+import { useRef as v, useEffect as F, useMemo as x } from "react";
+import { resetCss as d } from "../theme/theme.js";
+import { ActiveFeature as A, StandaloneFeature as I } from "./Features/index.js";
+import { MastersNavigation as M } from "./Navigation/MastersNavigation/index.js";
+import { SDKNotifications as B } from "./Notifications/index.js";
+import { SDKContainer as L, SDKScrollContainer as j } from "./styles.js";
+import { useMastersApp as D } from "./useMastersApp.js";
+import { MastersContext as E } from "./useMastersContext.js";
+import { useSdkFeature as K } from "./useSdkFeature.js";
+import { useSdkResponsive as O } from "./useSdkResponsive.js";
+import { useSdkScroll as R } from "./useSdkScroll.js";
+import { ChannelsButtonId as T } from "../navigation/button/Channels.js";
+import { LeaderBoardButtonId as b } from "../navigation/button/LeaderBoard.js";
+import { FeaturedGroupsButtonId as w } from "../navigation/button/FeaturedGroups.js";
 import "../theme/breakpoints.js";
 import "../theme/constants.js";
 import "@streamlayer/sdk-web-types";
 import "./Features/FeatureProvider.js";
-import "@nanostores/react";
+import "@linaria/react";
 import "@streamlayer/sdk-web-interfaces";
+import "./Features/Gamification/index.js";
+import "../gamification/detail/header/index.js";
+import "../gamification/constants.js";
+import "../gamification/detail/header/styles.js";
+import "../icons/index.js";
+import "../gamification/user-statistics/index.js";
+import "../../utils/common.js";
+import "../gamification/user-statistics/components/rank/index.js";
+import "../gamification/user-statistics/components/rank/styles.js";
+import "../gamification/user-statistics/components/statistic/index.js";
+import "../gamification/user-statistics/components/statistic/styles.js";
+import "../gamification/user-statistics/styles.js";
+import "../modal/index.js";
+import "@linaria/core";
+import "../../index-jRXrW6ie.js";
+import "../../index-uEuzH3jr.js";
+import "../show-in/index.js";
+import "./Features/Gamification/Question.js";
+import "../gamification/detail/sponsor/index.js";
+import "../gamification/vote/index.js";
+import "../gamification/vote/expired-alert/index.js";
+import "../gamification/vote/expired-alert/styles.js";
+import "../gamification/vote/feedback/index.js";
+import "../gamification/vote/feedback/styles.js";
+import "../gamification/vote/styles.js";
+import "../gamification/vote/vote-option/index.js";
+import "../animated-counter/index.js";
+import "react-countup";
+import "../gamification/vote/vote-option/styles.js";
+import "../gamification/vote/win-bar/index.js";
+import "../timer/index.js";
+import "react-countdown-circle-timer";
+import "../gamification/vote/win-bar/styles.js";
+import "../gamification/vote/insight-details/index.js";
+import "../questions/insight/index.js";
+import "../video-player/index.js";
+import "../video-player/styles.js";
+import "../questions/insight/styles.js";
+import "../gamification/vote/insight-details/styles.js";
+import "../gamification/vote/twitter-details/index.js";
+import "../questions/twitter/index.js";
+import "../questions/twitter/account/index.js";
+import "../questions/twitter/account/styles.js";
+import "../questions/twitter/styles.js";
+import "../gamification/vote/twitter-details/styles.js";
+import "./Features/Gamification/Tabs.js";
+import "../gamification/tabs/index.js";
+import "../gamification/tabs/styles.js";
+import "./Features/Gamification/Leaderboard.js";
+import "./useClipboardCopy.js";
+import "../gamification/copyNotification/index.js";
+import "../gamification/copyNotification/styles.js";
+import "../gamification/invite-link/index.js";
+import "../gamification/invite-link/styles.js";
+import "react-virtualized-auto-sizer";
+import "react-window";
+import "react-window-infinite-loader";
+import "../gamification/leaderboard/list-item/styles.js";
+import "../../styles_z07sl8-w40geAFS.js";
+import "../gamification/leaderboard/static.js";
+import "react-infinite-scroller";
+import "../gamification/leaderboard/list-item/index.js";
+import "./Features/Gamification/Friends.js";
+import "../gamification/onboarding/slides/onboarding-invite-card/index.js";
+import "../gamification/onboarding/slides/onboarding-invite-card/styles.js";
+import "./Features/Gamification/QuestionsList.js";
+import "../gamification/question/list/index.js";
+import "../gamification/question/index.js";
+import "../gamification/question/styles.js";
+import "../gamification/question/insight/index.js";
+import "../gamification/question/insight/styles.js";
+import "../gamification/question/twitter/index.js";
+import "../gamification/question/twitter/styles.js";
+import "../button/index.js";
+import "../button/styles.js";
+import "../gamification/question/list/styles.js";
+import "./Features/Gamification/UserSummary.js";
 import "../navigation/masters.js";
-import "@linaria/react";
 import "../navigation/index.js";
-import "../icons/index.js";
 import "../navigation/button/index.js";
 import "../navigation/button/styles.js";
-import "../../index-jRXrW6ie.js";
-import "../../index-uEuzH3jr.js";
 import "@streamlayer/sdk-web-notifications";
-import "../gamification/constants.js";
 import "../gamification/question/notification/index.js";
 import "../gamification/question/notification/insight/index.js";
-import "../video-player/index.js";
-import "../video-player/styles.js";
 import "../gamification/question/notification/insight/styles.js";
 import "../gamification/question/notification/styles.js";
 import "../gamification/question/notification/tweet/index.js";
-import "../questions/twitter/index.js";
-import "../questions/twitter/account/index.js";
-import "../../utils/common.js";
-import "../questions/twitter/account/styles.js";
-import "../questions/twitter/styles.js";
 import "../gamification/question/notification/tweet/styles.js";
 import "../gamification/question/notification/prediction-result/index.js";
-import "../animated-counter/index.js";
-import "react-countup";
 import "../gamification/question/notification/prediction-result/animation-lines/index.js";
 import "../gamification/question/notification/prediction-result/animation-lines/styles.js";
 import "../gamification/question/notification/prediction-result/styles.js";
-import "../show-in/index.js";
-import "@linaria/core";
 import "./Notifications/Onboarding/index.js";
 import "./useImagesPreload.js";
 import "../gamification/onboarding/index.js";
-import "react-virtualized-auto-sizer";
 import "../skeleton/index.js";
 import "../skeleton/styles.js";
 import "../gamification/onboarding/slides/onboarding-instructions/index.js";
 import "../gamification/onboarding/invitingUser/index.js";
 import "../gamification/onboarding/invitingUser/styles.js";
 import "../gamification/onboarding/slides/onboarding-instructions/styles.js";
-import "../gamification/onboarding/slides/onboarding-invite-card/index.js";
-import "./useClipboardCopy.js";
-import "../gamification/copyNotification/index.js";
-import "../gamification/copyNotification/styles.js";
-import "../gamification/onboarding/slides/onboarding-invite-card/styles.js";
 import "../gamification/onboarding/slides/onboarding-rules/index.js";
 import "../gamification/onboarding/slides/onboarding-rules/styles.js";
 import "../gamification/onboarding/slides/onboarding-terms/index.js";
 import "../gamification/onboarding/slides/onboarding-terms/styles.js";
 import "../gamification/onboarding/styles.js";
-import "../button/index.js";
-import "../button/styles.js";
-import "../modal/index.js";
 import "./Notifications/Onboarding/Notification/index.js";
 import "./Notifications/Onboarding/Notification/styles.js";
 import "./Notifications/styles.js";
@@ -80,71 +133,88 @@ import "../gamification/question/notification/pill/index.js";
 import "../gamification/question/notification/pill/styles.js";
 import "lodash.throttle";
 import "../../index-keh7OLCY.js";
-const b = ({ sdk: t, className: s, scrollStore: a, appNode: o, scrollNode: p, headerNode: i, responsiveStore: m }) => {
-  const [, n] = E(t);
-  return /* @__PURE__ */ r(
+const G = ({ sdk: t, className: e, scrollStore: n, appNode: r, scrollNode: p, headerNode: o, responsiveStore: i }) => {
+  const [, s] = K(t);
+  return /* @__PURE__ */ m(
     A,
     {
-      className: s,
+      className: e,
       scrollNode: p,
-      appNode: o,
-      scrollStore: a,
-      feature: n,
-      headerNode: i,
-      responsiveStore: m,
+      appNode: r,
+      scrollStore: n,
+      feature: s,
+      headerNode: o,
+      responsiveStore: i,
       sdk: t
     }
   );
-}, co = ({ sdk: t, overlays: s, children: a }) => {
-  const o = u(null), p = u(null), [i] = K(o), [m, n] = L(o, i), { sdkEnabled: l, sdkReady: d, activeOverlay: e, activateAndLoadOverlay: S, activateEventWithId: h, deactivate: g, isLogged: y } = j(t);
-  C(() => {
+}, P = ({ sdk: t, className: e, appNode: n, responsiveStore: r }) => {
+  const p = C(t.featuresList.getStore());
+  return p ? Array.from(p, (o) => {
+    const i = t.getFeature(o);
+    return i ? /* @__PURE__ */ m(
+      I,
+      {
+        className: e,
+        appNode: n,
+        feature: i,
+        responsiveStore: r,
+        sdk: t
+      },
+      o
+    ) : null;
+  }) : null;
+}, fo = ({ sdk: t, overlays: e, children: n }) => {
+  const r = v(null), p = v(null), [o] = O(r), [i, s] = R(r, o), { sdkEnabled: l, sdkReady: c, activeOverlay: a, activateAndLoadOverlay: S, activateEventWithId: h, deactivate: g, isLogged: N } = D(t);
+  F(() => {
     import("./Features/Gamification/gamification-feature.js");
   }, []);
-  const N = x(() => ({ sdk: t }), [t]);
-  return /* @__PURE__ */ r(D.Provider, { value: N, children: /* @__PURE__ */ f(B, { ref: o, children: [
-    l && /* @__PURE__ */ r(
-      I,
+  const y = x(() => ({ sdk: t }), [t]);
+  return /* @__PURE__ */ m(E.Provider, { value: y, children: /* @__PURE__ */ f(L, { ref: r, children: [
+    l && /* @__PURE__ */ m(
+      M,
       {
         ref: p,
-        sdkReady: d,
-        activeOverlay: e,
-        className: v,
-        setActiveOverlay: (c) => S("", c),
+        sdkReady: c,
+        activeOverlay: a,
+        className: d,
+        setActiveOverlay: (u) => S("", u),
         scrollToTop: () => {
-          var c;
-          return (c = m.current) == null ? void 0 : c.scrollTo(0, 0);
+          var u;
+          return (u = i.current) == null ? void 0 : u.scrollTo(0, 0);
         },
-        responsiveStore: i
+        responsiveStore: o
       }
     ),
-    /* @__PURE__ */ f(F, { className: "sl-hide-on-modal", ref: m, "data-nav": l.toString(), children: [
-      d && /* @__PURE__ */ r(
-        M,
+    /* @__PURE__ */ f(j, { className: "sl-hide-on-modal", ref: i, "data-nav": l.toString(), children: [
+      c && /* @__PURE__ */ m(
+        B,
         {
           sdk: t,
-          scrollNode: m,
+          scrollNode: i,
           headerNode: p,
-          appNode: o,
-          scrollStore: n,
-          responsiveStore: i
+          appNode: r,
+          scrollStore: s,
+          responsiveStore: o
         }
       ),
-      /* @__PURE__ */ r("div", { style: !l || e === O ? {} : { display: "none" }, children: a && a({ activateEventWithId: h, deactivate: g }) }),
-      s && e === R && s[e],
-      d && e === T && /* @__PURE__ */ r(
-        b,
+      /* @__PURE__ */ m("div", { style: !l || a === T ? {} : { display: "none" }, children: n && n({ activateEventWithId: h, deactivate: g }) }),
+      e && a === b && e[a],
+      c && a === w && /* @__PURE__ */ m(
+        G,
         {
-          scrollStore: n,
-          responsiveStore: i,
-          scrollNode: m,
-          appNode: o,
+          scrollStore: s,
+          responsiveStore: o,
+          scrollNode: i,
+          appNode: r,
           headerNode: p,
-          className: v,
+          className: d,
           sdk: t
         }
-      )
+      ),
+      c && /* @__PURE__ */ m(P, { responsiveStore: o, appNode: r, className: d, sdk: t })
     ] }),
-    l && !y && /* @__PURE__ */ r(
+    l && !N && /* @__PURE__ */ m(
       "div",
       {
         style: { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "100%" },
@@ -154,5 +224,5 @@ const b = ({ sdk: t, className: s, scrollStore: a, appNode: o, scrollNode: p, he
   ] }) });
 };
 export {
-  co as MastersApp
+  fo as MastersApp
 };

package/lib/ui/app/useMastersApp.js

@@ -9,11 +9,12 @@ import "../navigation/button/LeaderBoard.js";
 import "@linaria/react";
 import "../icons/index.js";
 import "../navigation/button/index.js";
+import "@linaria/core";
 import "../navigation/button/styles.js";
 import "../navigation/masters.js";
 import "../navigation/index.js";
 import "../theme/constants.js";
-const j = (e) => {
+const D = (e) => {
   const c = y(""), [S, o] = d(!1), E = A(e.status), a = A(e.userId()), f = A(e.getActiveFeature()), n = E === "ready", [l, r] = d(i), m = z(
     (t, s) => {
       r(s), s === i ? (t && e.createEventSession(t), window.requestAnimationFrame(() => {
@@ -71,5 +72,5 @@ const j = (e) => {
   };
 };
 export {
-  j as useMastersApp
+  D as useMastersApp
 };

package/lib/ui/gamification/question/list/index.js

@@ -1,8 +1,9 @@
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as e } from "react/jsx-runtime";
 import { Question as b } from "../index.js";
-import { Insight as p } from "../insight/index.js";
-import { Twitter as c } from "../twitter/index.js";
-import { QuestionsContainer as f } from "./styles.js";
+import { Insight as c } from "../insight/index.js";
+import { Twitter as f } from "../twitter/index.js";
+import { pauseAllVideos as l } from "../../../video-player/index.js";
+import { QuestionsContainer as d } from "./styles.js";
 import "@streamlayer/sdk-web-types";
 import "../../constants.js";
 import "../styles.js";
@@ -10,9 +11,8 @@ import "@linaria/react";
 import "../../../icons/index.js";
 import "react";
 import "../../../questions/insight/index.js";
-import "../../../video-player/index.js";
-import "../../../video-player/styles.js";
 import "../../../questions/insight/styles.js";
+import "../../../video-player/styles.js";
 import "../insight/styles.js";
 import "../../../questions/twitter/index.js";
 import "../../../questions/twitter/account/index.js";
@@ -22,31 +22,44 @@ import "../../../questions/twitter/styles.js";
 import "../twitter/styles.js";
 import "../../../button/index.js";
 import "../../../button/styles.js";
-const J = ({ questions: e, openQuestion: m, controlVideo: o }) => /* @__PURE__ */ r(f, { children: e == null ? void 0 : e.map((t) => {
-  var u, a, n;
-  if (t.type === "question" && ((u = t.attributes) == null ? void 0 : u.attributes.case) === "question") {
-    const i = t.attributes.attributes.value;
-    return /* @__PURE__ */ r(b, { openQuestion: m, ...i }, i.questionId);
-  }
-  if (t.type === "insight" && ((a = t.attributes) == null ? void 0 : a.attributes.case) === "insight") {
-    const i = t.attributes.attributes.value;
-    return /* @__PURE__ */ r(p, { openInsight: m, controlVideo: o, ...i }, i.questionId);
-  }
-  if (t.type === "tweet" && ((n = t.attributes) == null ? void 0 : n.attributes.case) === "tweet") {
-    const i = t.attributes.attributes.value, s = t.attributes.id;
-    return /* @__PURE__ */ r(
-      c,
-      {
-        openTweet: m,
-        controlVideo: o,
-        ...i,
-        tweetId: s
-      },
-      s
-    );
-  }
-  return null;
-}) });
+const K = ({ questions: r, openQuestion: p, controlVideo: m }) => {
+  const o = (t) => {
+    l(), p(t);
+  };
+  return /* @__PURE__ */ e(d, { children: r == null ? void 0 : r.map((t) => {
+    var n, u, s;
+    if (t.type === "question" && ((n = t.attributes) == null ? void 0 : n.attributes.case) === "question") {
+      const i = t.attributes.attributes.value;
+      return /* @__PURE__ */ e(b, { openQuestion: o, ...i }, i.questionId);
+    }
+    if (t.type === "insight" && ((u = t.attributes) == null ? void 0 : u.attributes.case) === "insight") {
+      const i = t.attributes.attributes.value;
+      return /* @__PURE__ */ e(
+        c,
+        {
+          openInsight: o,
+          controlVideo: m,
+          ...i
+        },
+        i.questionId
+      );
+    }
+    if (t.type === "tweet" && ((s = t.attributes) == null ? void 0 : s.attributes.case) === "tweet") {
+      const i = t.attributes.attributes.value, a = t.attributes.id;
+      return /* @__PURE__ */ e(
+        f,
+        {
+          openTweet: o,
+          controlVideo: m,
+          ...i,
+          tweetId: a
+        },
+        a
+      );
+    }
+    return null;
+  }) });
+};
 export {
-  J as QuestionList
+  K as QuestionList
 };

package/lib/ui/gamification/question/notification/index.js

@@ -1,8 +1,8 @@
 import { jsxs as a, jsx as o, Fragment as d } from "react/jsx-runtime";
-import { QuestionType as t } from "@streamlayer/sdk-web-types";
+import { QuestionType as m } from "@streamlayer/sdk-web-types";
 import { QuestionTypeData as T } from "../../constants.js";
 import { Insight as f } from "./insight/index.js";
-import { Container as h, CloseIconWrap as E, CloseIcon as I, Header as C, TypeIcon as s, TypeName as A, Question as W, AnswerButton as x } from "./styles.js";
+import { Container as E, CloseIconWrap as I, CloseIcon as h, Header as C, TypeIcon as A, TypeName as W, Question as s, AnswerButton as x } from "./styles.js";
 import { Tweet as D } from "./tweet/index.js";
 import "../../../video-player/index.js";
 import "react";
@@ -16,37 +16,34 @@ import "../../../../utils/common.js";
 import "../../../questions/twitter/account/styles.js";
 import "../../../questions/twitter/styles.js";
 import "./tweet/styles.js";
-const G = ({
-  close: n,
-  action: i,
+const J = ({
+  close: e,
+  action: t,
   controlVideo: l,
-  data: { questionType: r, question: m, insight: e, tweet: c }
+  data: { questionType: r, question: i, insight: n, tweet: c }
 }) => {
   const p = T[r];
-  return p ? /* @__PURE__ */ a(h, { style: r === t.TWEET ? { paddingTop: "12px" } : {}, children: [
-    /* @__PURE__ */ o(E, { onClick: n, children: /* @__PURE__ */ o(I, { name: "icon-cross" }) }),
-    r !== t.TWEET && /* @__PURE__ */ a(C, { children: [
+  return p ? /* @__PURE__ */ a(E, { style: r === m.TWEET ? { paddingTop: "12px" } : {}, children: [
+    /* @__PURE__ */ o(I, { onClick: e, children: /* @__PURE__ */ o(h, { name: "icon-cross" }) }),
+    r !== m.TWEET && /* @__PURE__ */ a(C, { children: [
       /* @__PURE__ */ o(
-        s,
+        A,
         {
-          "data-type-trivia": r === t.TRIVIA,
-          "data-type-poll": r === t.POLL,
+          "data-type-trivia": r === m.TRIVIA,
+          "data-type-poll": r === m.POLL,
           name: p.iconName
         }
       ),
-      /* @__PURE__ */ o(A, { children: p.label })
+      /* @__PURE__ */ o(W, { children: p.label })
     ] }),
-    r === t.FACTOID && /* @__PURE__ */ o(f, { ...e, action: i, controlVideo: l }),
-    r === t.TWEET && // ToDo: connect with real Api data
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    /* @__PURE__ */ o(D, { ...c, action: i }),
-    r !== t.FACTOID && r !== t.TWEET && /* @__PURE__ */ a(d, { children: [
-      /* @__PURE__ */ o(W, { children: m == null ? void 0 : m.title }),
-      /* @__PURE__ */ o(x, { onClick: i, children: "Answer" })
+    r === m.FACTOID && n && /* @__PURE__ */ o(f, { ...n, action: t, controlVideo: l }),
+    r === m.TWEET && c && /* @__PURE__ */ o(D, { ...c, action: t, controlVideo: l }),
+    r !== m.FACTOID && r !== m.TWEET && /* @__PURE__ */ a(d, { children: [
+      /* @__PURE__ */ o(s, { children: i == null ? void 0 : i.title }),
+      /* @__PURE__ */ o(x, { onClick: t, children: "Answer" })
     ] })
   ] }) : null;
 };
 export {
-  G as Notification
+  J as Notification
 };

package/lib/ui/gamification/question/twitter/index.js

@@ -1,4 +1,4 @@
-import { jsxs as r, jsx as i } from "react/jsx-runtime";
+import { jsxs as o, jsx as i } from "react/jsx-runtime";
 import { TwitterContent as m } from "../../../questions/twitter/index.js";
 import { Container as e, Quote as n, ActionButton as p } from "./styles.js";
 import "../../../video-player/index.js";
@@ -12,10 +12,10 @@ import "../../../questions/twitter/account/styles.js";
 import "../../../questions/twitter/styles.js";
 import "../../../button/index.js";
 import "../../../button/styles.js";
-const k = ({ openTweet: o, ...t }) => /* @__PURE__ */ r(e, { children: [
+const k = ({ openTweet: r, ...t }) => /* @__PURE__ */ o(e, { children: [
   t.title && /* @__PURE__ */ i(n, { children: t.title }),
   /* @__PURE__ */ i(m, { ...t }),
-  o && /* @__PURE__ */ i(p, { onClick: () => o(t.tweetId), children: "View Insight" })
+  r && /* @__PURE__ */ i(p, { onClick: () => r(t.tweetId), children: "View Insight" })
 ] });
 export {
   k as Twitter

package/lib/ui/gamification/vote/feedback/index.js

@@ -1,66 +1,69 @@
-import { jsxs as r, Fragment as o, jsx as i } from "react/jsx-runtime";
-import { QuestionType as n, QuestionStatus as Q } from "@streamlayer/sdk-web-types";
+import { jsxs as r, Fragment as t, jsx as i } from "react/jsx-runtime";
+import { QuestionType as c, QuestionStatus as f } from "@streamlayer/sdk-web-types";
 import { SvgIcon as l } from "../../../icons/index.js";
-import { Container as f, FeedbackIconWrap as h, FeedbackHeader as p, FeedbackDescription as d, FeedbackText as s, IconPrediction as L, FeedbackTitle as j } from "./styles.js";
+import { Container as Q, FeedbackIconWrap as h, FeedbackHeader as p, FeedbackDescription as d, FeedbackText as s, IconPrediction as W, DynamicWrap as L, FeedbackTitle as j } from "./styles.js";
 import "@linaria/react";
 import "react";
-const B = ({
+const G = ({
   feedbackMessages: e,
-  questionVotedCorrectly: I,
+  questionVotedCorrectly: u,
   questionVoted: a,
-  questionType: c,
+  questionType: n,
   hasCorrectAnswer: F,
   questionStatus: T,
-  showExpiredNotification: u,
-  showClosedNotificationTrivia: w,
+  showExpiredNotification: I,
+  showClosedNotificationTrivia: b,
   votedInCurrentRender: m,
-  votedAfterQuestionClosed: y,
-  enteredAnActiveQuestion: E,
-  marketClosed: N
+  votedAfterQuestionClosed: N,
+  enteredAnActiveQuestion: k,
+  marketClosed: S
 }) => {
-  const b = a && (c === n.TRIVIA || c === n.PREDICTION) && m && T !== Q.RESOLVED, k = c === n.PREDICTION && !F, x = N && c === n.PREDICTION && !a && !E || c === n.PREDICTION && y && m && E, D = b && k, O = b && F, R = c === n.PREDICTION && a && m && F, S = a && c === n.POLL && m;
-  if (!u && !w && !D && !O && !x && !S && !R)
+  const E = a && (n === c.TRIVIA || n === c.PREDICTION) && m && T !== f.RESOLVED, w = n === c.PREDICTION && !F, x = S && n === c.PREDICTION && !a && !k || n === c.PREDICTION && N && m && k, D = E && w, O = E && F, y = n === c.PREDICTION && a && m && F, R = a && n === c.POLL && m;
+  if (!I && !b && !D && !O && !x && !R && !y)
     return null;
-  const P = I ? "correct" : "incorrect", t = I ? e == null ? void 0 : e.correctFeedback : e == null ? void 0 : e.incorrectFeedback;
-  return /* @__PURE__ */ r(f, { "data-isPrediction": k, children: [
-    u && /* @__PURE__ */ r(o, { children: [
+  const P = u ? "correct" : "incorrect", o = u ? e == null ? void 0 : e.correctFeedback : e == null ? void 0 : e.incorrectFeedback;
+  return /* @__PURE__ */ r(Q, { "data-isPrediction": w, children: [
+    I && /* @__PURE__ */ r(t, { children: [
       /* @__PURE__ */ i(h, { children: /* @__PURE__ */ i(l, { name: "questionExpired" }) }),
       /* @__PURE__ */ r("div", { children: [
         /* @__PURE__ */ i(p, { children: /* @__PURE__ */ i(d, { children: "Question Expired" }) }),
         /* @__PURE__ */ i(s, { children: "You can still answer to see if you're correct, but no points are awarded for expired questions." })
       ] })
     ] }),
-    w && /* @__PURE__ */ r(o, { children: [
+    b && /* @__PURE__ */ r(t, { children: [
       /* @__PURE__ */ i(h, { children: /* @__PURE__ */ i(l, { name: "questionExpired" }) }),
       /* @__PURE__ */ r("div", { children: [
         /* @__PURE__ */ i(p, { children: /* @__PURE__ */ i(d, { children: "Question Closed" }) }),
         /* @__PURE__ */ i(s, { children: "This question was answered after the moderator closed the question. So the points for this answer won’t tally." })
       ] })
     ] }),
-    x && /* @__PURE__ */ r(o, { children: [
+    x && /* @__PURE__ */ r(t, { children: [
       /* @__PURE__ */ i(h, { children: /* @__PURE__ */ i(l, { name: "questionExpired" }) }),
       /* @__PURE__ */ r("div", { children: [
         /* @__PURE__ */ i(p, { children: /* @__PURE__ */ i(d, { children: "Question Closed" }) }),
         /* @__PURE__ */ i(s, { children: "This event has already taken place, so the ability to make a prediction on its outcome is no longer available." })
       ] })
     ] }),
-    D && /* @__PURE__ */ r(o, { children: [
-      /* @__PURE__ */ i(L, { name: "icon-prediction" }),
-      /* @__PURE__ */ i(d, { children: "Stay tuned to see if your prediction was correct." })
+    D && /* @__PURE__ */ r(t, { children: [
+      /* @__PURE__ */ i(W, { name: "icon-prediction" }),
+      /* @__PURE__ */ r(d, { children: [
+        "Your pick has been recorded. ",
+        /* @__PURE__ */ i(L, { children: "We’ll notify you of the result." })
+      ] })
     ] }),
-    S && /* @__PURE__ */ r(o, { children: [
+    R && /* @__PURE__ */ r(t, { children: [
       /* @__PURE__ */ i(h, { "data-feedback-type": "correct", children: /* @__PURE__ */ i(l, { name: "correct" }) }),
       /* @__PURE__ */ i(d, { children: "Thanks for answering. Please stay tuned for the next question." })
     ] }),
-    (O || R) && /* @__PURE__ */ r(o, { children: [
+    (O || y) && /* @__PURE__ */ r(t, { children: [
       /* @__PURE__ */ i(h, { "data-feedback-type": P, children: /* @__PURE__ */ i(l, { name: P }) }),
       /* @__PURE__ */ i("div", { children: /* @__PURE__ */ r(p, { children: [
-        /* @__PURE__ */ i(j, { "data-feedback-type": P, children: t == null ? void 0 : t.title }),
-        /* @__PURE__ */ i(d, { children: t == null ? void 0 : t.description })
+        /* @__PURE__ */ i(j, { "data-feedback-type": P, children: o == null ? void 0 : o.title }),
+        /* @__PURE__ */ i(d, { children: o == null ? void 0 : o.description })
       ] }) })
     ] })
   ] });
 };
 export {
-  B as Feedback
+  G as Feedback
 };

package/lib/ui/gamification/vote/feedback/styles.d.ts

@@ -6,3 +6,4 @@ export declare const FeedbackHeader: import("@linaria/react").StyledComponent<im
 export declare const FeedbackTitle: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & Record<never, unknown>>;
 export declare const FeedbackDescription: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & Record<never, unknown>>;
 export declare const FeedbackText: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const DynamicWrap: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & Record<never, unknown>>;