@streamlayer/react-ui 0.93.0 → 0.95.0

package/lib/ui/app/useSdkResponsive.js

@@ -1,45 +1,45 @@
 import c from "lodash.throttle";
-import { useState as m, useEffect as k } from "react";
-import { BREAKPOINTS as s } from "../theme/constants.js";
-import { m as u } from "../../index-keh7OLCY.js";
+import { useState as m, useEffect as u } from "react";
+import { BREAKPOINTS as r } from "../theme/constants.js";
+import { m as p } from "../../index-keh7OLCY.js";
 import "../../index-uEuzH3jr.js";
-const d = Object.keys(s), i = () => {
-  const n = window.innerWidth;
+const d = Object.keys(r), i = () => {
+  const t = window.innerWidth;
   let e = "sm";
-  for (let t = d.length - 1; t > 0; t--) {
-    const r = d[t];
-    if (!(n < s[r]) && n >= s[r]) {
-      e = r;
+  for (let n = d.length - 1; n > 0; n--) {
+    const s = d[n];
+    if (!(t < r[s]) && t >= r[s]) {
+      e = s;
       break;
     }
   }
   return {
     name: e,
-    size: s[e]
+    size: r[e]
   };
-}, w = (n) => {
+}, w = (t) => {
   var e;
-  return (((e = n.current) == null ? void 0 : e.getBoundingClientRect().y) || 0) < -68;
-}, l = (n) => n >= s.xl, I = (n) => {
+  return (((e = t.current) == null ? void 0 : e.getBoundingClientRect().y) || 0) < -68;
+}, k = (t) => t >= r.xl, I = (t) => {
   const [e] = m(() => {
-    const t = i();
-    return u({
+    const n = i();
+    return p({
       screen: i(),
-      sdkInView: w(n),
-      sdkInScrollView: l(t.size)
+      sdkInView: w(t),
+      sdkInDesktopView: k(n.size)
     });
   });
-  return k(() => {
-    const t = c(() => {
-      e.setKey("sdkInView", w(n));
-    }, 200), r = c(() => {
+  return u(() => {
+    const n = c(() => {
+      e.setKey("sdkInView", w(t));
+    }, 200), s = c(() => {
       const o = i();
-      e.setKey("screen", o), e.setKey("sdkInScrollView", l(o.size));
+      e.setKey("screen", o), e.setKey("sdkInDesktopView", k(o.size));
     }, 200);
-    return window.addEventListener("scroll", t), window.addEventListener("resize", r), () => {
-      window.removeEventListener("scroll", t), window.removeEventListener("resize", r);
+    return window.addEventListener("scroll", n), window.addEventListener("resize", s), () => {
+      window.removeEventListener("scroll", n), window.removeEventListener("resize", s);
     };
-  }, [e, n]), [e];
+  }, [e, t]), [e];
 };
 export {
   I as useSdkResponsive

package/lib/ui/app/useSdkScroll.js

@@ -1,35 +1,36 @@
-import { useStore as w } from "@nanostores/react";
+import { useStore as p } from "@nanostores/react";
 import S from "lodash.throttle";
-import { useRef as f, useState as h, useEffect as g } from "react";
+import { useRef as f, useState as h, useEffect as b } from "react";
 import { BREAKPOINTS as m } from "../theme/constants.js";
-import { m as v } from "../../index-keh7OLCY.js";
+import { m as g } from "../../index-keh7OLCY.js";
 import "../../index-uEuzH3jr.js";
-const D = (t, n) => {
+const C = (t, n) => {
   var r;
-  (r = t.current) == null || r.scrollIntoView(n);
-}, I = (t, n) => {
+  (r = t.current) == null || r.scrollIntoView(n), window.scrollBy({ top: -52 });
+}, D = (t, n) => {
   const r = f(null), l = f(0), [e] = h(
-    v({
+    g({
       scrollPosition: 0,
+      tabsShown: !0,
       scrollDirection: "forward"
     })
-  ), c = w(n);
-  return g(() => {
+  ), c = p(n);
+  return b(() => {
     const s = window.innerWidth < m.xl ? window : r.current;
     if (!s)
       return () => {
       };
-    const i = S((d) => {
+    const i = S((w) => {
       var a;
-      const u = d.target;
+      const u = w.target;
       if (!u)
         return;
       let o = 0;
       c.screen.size < m.xl ? o = ((a = t.current) == null ? void 0 : a.getBoundingClientRect().y) || 0 : o = u.scrollTop;
-      const p = l.current < o ? "forward" : "backward";
+      const d = l.current < o ? "forward" : "backward";
       l.current = o, e.set({
         scrollPosition: Math.round(o),
-        scrollDirection: p,
+        scrollDirection: d,
         tabsShown: e.get().tabsShown
       });
     }, 200);
@@ -39,6 +40,6 @@ const D = (t, n) => {
   }, [e, t, c.screen]), [r, e];
 };
 export {
-  D as scrollIntoAppView,
-  I as useSdkScroll
+  C as scrollIntoAppView,
+  D as useSdkScroll
 };

package/lib/ui/gamification/onboarding/index.d.ts

@@ -15,7 +15,7 @@ type OnboardingType = OnboardingInviteCardProps & {
     primaryColor?: string;
     inviteCardBtnLabel?: string;
     loading: boolean;
-    renderToNode: AppNodeRef | HeaderNodeRef;
+    renderToNode?: AppNodeRef | HeaderNodeRef;
     onClose: () => void;
 };
 export declare const Onboarding: React.FC<OnboardingType>;

package/lib/ui/gamification/onboarding/index.js

@@ -10,7 +10,8 @@ import { Container as q, OnboardingHeader as J, CloseBtn as K, IconClose as Q, C
 import "../../skeleton/styles.js";
 import "@linaria/react";
 import "./slides/onboarding-instructions/styles.js";
-import "../../../useClipboardCopy-E5rEe6It.js";
+import "../../app/useClipboardCopy.js";
+import "../../../index-jRXrW6ie.js";
 import "../../../index-uEuzH3jr.js";
 import "../copyNotification/index.js";
 import "../../icons/index.js";
@@ -42,14 +43,14 @@ const m = {
   renderToNode: I,
   onClose: N
 }) => {
-  const [e, b] = c(0), [l, p] = c(!1), [n, o] = c(m);
+  const [o, p] = c(0), [l, b] = c(!1), [n, e] = c(m);
   j(() => {
-    i != null && i.length ? o({ ...m, steps: !0 }) : r != null && r.length ? o({ ...m, rules: !0 }) : o({ ...m, inviteCard: !0 });
+    i != null && i.length ? e({ ...m, steps: !0 }) : r != null && r.length ? e({ ...m, rules: !0 }) : e({ ...m, inviteCard: !0 });
   }, []);
-  const w = H(() => n.steps && e === 0 ? "Continue" : n.rules ? l || !a ? "Got it" : a : n.inviteCard ? h || "Play Now" : "Next", [n, e, l, a, h]), A = z(() => {
-    i != null && i.length && e < i.length - 1 ? b((d) => ++d) : r != null && r.length && n.steps ? o({ ...m, rules: !0 }) : n.rules && o({ ...m, inviteCard: !0 });
-  }, [e, i == null ? void 0 : i.length, r == null ? void 0 : r.length, n, b, o]), D = async () => {
-    n.inviteCard ? await S.onboardingStatus.submitInplay() : n.rules && l ? p(!1) : A();
+  const w = H(() => n.steps && o === 0 ? "Continue" : n.rules ? l || !a ? "Got it" : a : n.inviteCard ? h || "Play Now" : "Next", [n, o, l, a, h]), A = z(() => {
+    i != null && i.length && o < i.length - 1 ? p((d) => ++d) : r != null && r.length && n.steps ? e({ ...m, rules: !0 }) : n.rules && e({ ...m, inviteCard: !0 });
+  }, [o, i == null ? void 0 : i.length, r == null ? void 0 : r.length, n, p, e]), D = async () => {
+    n.inviteCard ? await S.onboardingStatus.submitInplay() : n.rules && l ? b(!1) : A();
   };
   return /* @__PURE__ */ t(E, { children: ({ width: d, height: C }) => /* @__PURE__ */ O(q, { style: { width: d, height: C, maxHeight: C }, children: [
     /* @__PURE__ */ t(J, { children: /* @__PURE__ */ t(K, { onClick: N, children: /* @__PURE__ */ t(Q, { name: "icon-close-btn-gray" }) }) }),
@@ -59,8 +60,8 @@ const m = {
         {
           loading: u,
           stepsCount: i.length,
-          currentStep: e,
-          ...i[e]
+          currentStep: o,
+          ...i[o]
         }
       ),
       n.rules && !l && /* @__PURE__ */ t(
@@ -70,7 +71,7 @@ const m = {
           rulesTitle: y,
           termsText: f,
           primaryColor: g,
-          openTerms: () => p(!0)
+          openTerms: () => b(!0)
         }
       ),
       n.rules && l && /* @__PURE__ */ t(R, { termsTitle: s, termsText: f }),

package/lib/ui/gamification/onboarding/slides/onboarding-invite-card/index.js

@@ -1,30 +1,31 @@
 import { jsxs as o, jsx as n } from "react/jsx-runtime";
-import { u as I } from "../../../../../useClipboardCopy-E5rEe6It.js";
+import { useClipboardCopy as I } from "../../../../app/useClipboardCopy.js";
 import { SvgIcon as f } from "../../../../icons/index.js";
-import { Container as g, IconContainer as k, InviteGameIcon as s, Content as b, Heading as y, Subtext as u, LinkContainer as L, LinkInfo as S, LinkTitle as x, LinkAddress as v, LinkIcon as j, SocialLinksContainer as A, SocialLink as G, SocialLinkLabel as H } from "./styles.js";
+import { Container as g, IconContainer as k, InviteGameIcon as b, Content as s, Heading as y, Subtext as L, LinkContainer as S, LinkInfo as u, LinkTitle as x, LinkAddress as v, LinkIcon as j, SocialLinksContainer as A, SocialLink as G, SocialLinkLabel as H } from "./styles.js";
 import "react";
+import "../../../../../index-jRXrW6ie.js";
 import "../../../../../index-uEuzH3jr.js";
 import "../../../copyNotification/index.js";
 import "../../../copyNotification/styles.js";
 import "@linaria/react";
-const E = ({
+const F = ({
   renderToNode: t,
   inviteLink: r,
   socialLinks: i,
   inviteCardTitle: c,
   inviteCardSubtext: l,
-  primaryColor: a,
-  className: d
+  primaryColor: m,
+  className: a
 }) => {
-  const [m, p] = I(t);
-  return /* @__PURE__ */ o(g, { className: d, children: [
-    /* @__PURE__ */ n(k, { style: { backgroundColor: a }, children: /* @__PURE__ */ n(s, { name: "invite-game-icon" }) }),
-    /* @__PURE__ */ o(b, { children: [
+  const [d, p] = I(t);
+  return /* @__PURE__ */ o(g, { className: a, children: [
+    /* @__PURE__ */ n(k, { style: { backgroundColor: m }, children: /* @__PURE__ */ n(b, { name: "invite-game-icon" }) }),
+    /* @__PURE__ */ o(s, { children: [
       /* @__PURE__ */ n(y, { children: c || "" }),
-      /* @__PURE__ */ n(u, { children: l || "" })
+      /* @__PURE__ */ n(L, { children: l || "" })
     ] }),
-    r && /* @__PURE__ */ o(L, { onClick: () => m(r), children: [
-      /* @__PURE__ */ o(S, { children: [
+    r && /* @__PURE__ */ o(S, { onClick: () => d(r), children: [
+      /* @__PURE__ */ o(u, { children: [
         /* @__PURE__ */ n(x, { children: "Invite link" }),
         /* @__PURE__ */ n(v, { children: r })
       ] }),
@@ -38,5 +39,5 @@ const E = ({
   ] });
 };
 export {
-  E as OnboardingInviteCard
+  F as OnboardingInviteCard
 };

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

@@ -1,14 +1,13 @@
 import { jsxs as m, jsx as i } from "react/jsx-runtime";
 import { InsightContent as n } from "../../../questions/insight/index.js";
 import { Container as p, ActionBtn as c } from "./styles.js";
-import "react";
 import "../../../video-player/index.js";
+import "react";
 import "../../../icons/index.js";
 import "@linaria/react";
 import "../../../video-player/styles.js";
-import "../../../../utils/common.js";
 import "../../../questions/insight/styles.js";
-const d = ({
+const a = ({
   openInsight: r,
   questionId: t,
   ...o
@@ -17,5 +16,5 @@ const d = ({
   r && /* @__PURE__ */ i(c, { onClick: () => r(t), children: "View Insight" })
 ] });
 export {
-  d as Insight
+  a as Insight
 };

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

@@ -1,8 +1,8 @@
 import { jsx as r } from "react/jsx-runtime";
-import { Question as b } from "../index.js";
-import { Insight as c } from "../insight/index.js";
-import { Twitter as d } from "../twitter/index.js";
-import { QuestionsContainer as f } from "./styles.js";
+import { Question as s } from "../index.js";
+import { Insight as b } from "../insight/index.js";
+import { Twitter as p } from "../twitter/index.js";
+import { QuestionsContainer as c } from "./styles.js";
 import "@streamlayer/sdk-web-types";
 import "../../constants.js";
 import "../styles.js";
@@ -12,32 +12,32 @@ import "react";
 import "../../../questions/insight/index.js";
 import "../../../video-player/index.js";
 import "../../../video-player/styles.js";
-import "../../../../utils/common.js";
 import "../../../questions/insight/styles.js";
 import "../insight/styles.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 "../twitter/styles.js";
 import "../../../button/index.js";
 import "../../../button/styles.js";
-const J = ({ questions: m, openQuestion: o }) => /* @__PURE__ */ r(f, { children: m == null ? void 0 : m.map((t) => {
-  var a, u, n;
-  if (t.type === "question" && ((a = t.attributes) == null ? void 0 : a.attributes.case) === "question") {
+const H = ({ questions: e, openQuestion: m }) => /* @__PURE__ */ r(c, { children: e == null ? void 0 : e.map((t) => {
+  var o, u, n;
+  if (t.type === "question" && ((o = t.attributes) == null ? void 0 : o.attributes.case) === "question") {
     const i = t.attributes.attributes.value;
-    return /* @__PURE__ */ r(b, { openQuestion: o, ...i }, i.questionId);
+    return /* @__PURE__ */ r(s, { openQuestion: m, ...i }, i.questionId);
   }
   if (t.type === "insight" && ((u = t.attributes) == null ? void 0 : u.attributes.case) === "insight") {
-    const i = t.attributes.attributes.value, e = t.attributes.created;
-    return /* @__PURE__ */ r(c, { openInsight: o, ...i, created: e }, i.questionId);
+    const i = t.attributes.attributes.value;
+    return /* @__PURE__ */ r(b, { openInsight: m, ...i }, i.questionId);
   }
   if (t.type === "tweet" && ((n = t.attributes) == null ? void 0 : n.attributes.case) === "tweet") {
-    const i = t.attributes.attributes.value, e = t.attributes.id, s = t.attributes.created;
-    return /* @__PURE__ */ r(d, { openTweet: o, ...i, tweetId: e, created: s }, e);
+    const i = t.attributes.attributes.value, a = t.attributes.id;
+    return /* @__PURE__ */ r(p, { openTweet: m, ...i, tweetId: a }, a);
   }
   return null;
 }) });
 export {
-  J as QuestionList
+  H as QuestionList
 };

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

@@ -12,10 +12,11 @@ import "../../../video-player/styles.js";
 import "./insight/styles.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 "./tweet/styles.js";
-const y = ({
+const z = ({
   close: n,
   action: i,
   data: { questionType: r, question: m, insight: l, tweet: e }
@@ -46,5 +47,5 @@ const y = ({
   ] }) : null;
 };
 export {
-  y as Notification
+  z as Notification
 };

package/lib/ui/gamification/question/notification/insight/index.d.ts

@@ -1,6 +1,8 @@
 /// <reference types="react" />
 import type { Notification } from '@streamlayer/sdk-web-notifications';
-import { InstantView } from '@streamlayer/sdk-web-types';
-export declare const Insight: React.FC<InstantView & {
+import { InsightHistory, InstantView } from '@streamlayer/sdk-web-types';
+export type InsightProps = InstantView & {
+    imageMode: InsightHistory['imageMode'];
     action: Notification['action'];
-}>;
+};
+export declare const Insight: React.FC<InsightProps>;

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

@@ -1,25 +1,20 @@
-import { jsxs as i, jsx as t } from "react/jsx-runtime";
-import { VideoPlayer as c } from "../../../../video-player/index.js";
-import { InsightContainer as h, Image as p, InsightContent as o, Title as u, Description as e, ActionBtn as I } from "./styles.js";
+import { jsxs as m, jsx as t } from "react/jsx-runtime";
+import { QuestionImages as c } from "@streamlayer/sdk-web-types";
+import { VideoPlayer as p } from "../../../../video-player/index.js";
+import { InsightContainer as e, ImageContainer as h, Image as u, InsightContent as a, Title as I, Description as g, ActionBtn as f } from "./styles.js";
 import "react";
 import "../../../../icons/index.js";
 import "@linaria/react";
 import "../../../../video-player/styles.js";
-const b = ({
-  video: r,
-  image: n,
-  heading: s,
-  body: m,
-  action: l
-}) => /* @__PURE__ */ i(h, { children: [
-  (r == null ? void 0 : r.url) && /* @__PURE__ */ t(c, { source: r.url, poster: r.thumbnailUrl }),
-  n && !(r != null && r.url) && /* @__PURE__ */ t(p, { src: n }),
-  /* @__PURE__ */ i(o, { children: [
-    /* @__PURE__ */ t(u, { children: s }),
-    /* @__PURE__ */ t(e, { children: m }),
-    l && /* @__PURE__ */ t(I, { onClick: l, children: "View Insight" })
+const w = ({ video: r, image: n, imageMode: s, heading: i, body: o, action: l }) => /* @__PURE__ */ m(e, { children: [
+  (r == null ? void 0 : r.url) && /* @__PURE__ */ t(p, { source: r.url, poster: r.thumbnailUrl }),
+  n && !(r != null && r.url) && /* @__PURE__ */ t(h, { "data-rounded": s === c.ROUNDED, children: /* @__PURE__ */ t(u, { src: n, alt: i }) }),
+  /* @__PURE__ */ m(a, { children: [
+    /* @__PURE__ */ t(I, { children: i }),
+    /* @__PURE__ */ t(g, { children: o }),
+    l && /* @__PURE__ */ t(f, { onClick: l, children: "View Insight" })
   ] })
 ] });
 export {
-  b as Insight
+  w as Insight
 };

package/lib/ui/gamification/question/notification/insight/styles.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 export declare const InsightContainer: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
 export declare const Image: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLImageElement> & import("react").ImgHTMLAttributes<HTMLImageElement> & Record<never, unknown>>;
+export declare const ImageContainer: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
 export declare const InsightContent: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
 export declare const Title: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLHeadingElement> & import("react").HTMLAttributes<HTMLHeadingElement> & Record<never, unknown>>;
 export declare const Description: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;

package/lib/ui/gamification/question/notification/insight/styles.js

@@ -7,28 +7,33 @@ const t = /* @__PURE__ */ s("div")({
   name: "Image",
   class: "igj7luu",
   propsAsIs: !1
+}), a = /* @__PURE__ */ s("div")({
+  name: "ImageContainer",
+  class: "i1qne9g6",
+  propsAsIs: !1
 }), o = /* @__PURE__ */ s("div")({
   name: "InsightContent",
-  class: "i1qne9g6",
+  class: "itpr98r",
   propsAsIs: !1
-}), a = /* @__PURE__ */ s("h3")({
+}), i = /* @__PURE__ */ s("h3")({
   name: "Title",
-  class: "ttpr98r",
+  class: "t17iaqp8",
   propsAsIs: !1
-}), i = /* @__PURE__ */ s("div")({
+}), p = /* @__PURE__ */ s("div")({
   name: "Description",
-  class: "d17iaqp8",
+  class: "d16t3y7s",
   propsAsIs: !1
-}), p = /* @__PURE__ */ s("button")({
+}), r = /* @__PURE__ */ s("button")({
   name: "ActionBtn",
-  class: "a16t3y7s",
+  class: "a12495er",
   propsAsIs: !1
 });
 export {
-  p as ActionBtn,
-  i as Description,
+  r as ActionBtn,
+  p as Description,
   e as Image,
+  a as ImageContainer,
   t as InsightContainer,
   o as InsightContent,
-  a as Title
+  i as Title
 };

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

@@ -1,17 +1,20 @@
 import { jsxs as o, jsx as t } from "react/jsx-runtime";
 import { TwitterContent as e } from "../../../../questions/twitter/index.js";
-import { Container as n, QuoteWrap as m, Quote as l, ActionBtn as p } from "./styles.js";
-import "../../../../questions/twitter/account/index.js";
+import { Container as m, QuoteWrap as n, Quote as p, ActionBtn as l } from "./styles.js";
+import "../../../../video-player/index.js";
+import "react";
 import "../../../../icons/index.js";
 import "@linaria/react";
-import "react";
+import "../../../../video-player/styles.js";
+import "../../../../questions/twitter/account/index.js";
+import "../../../../../utils/common.js";
 import "../../../../questions/twitter/account/styles.js";
 import "../../../../questions/twitter/styles.js";
-const j = ({ action: r, ...i }) => /* @__PURE__ */ o(n, { children: [
-  i.title && /* @__PURE__ */ t(m, { children: /* @__PURE__ */ t(l, { children: i.title }) }),
+const a = ({ action: r, ...i }) => /* @__PURE__ */ o(m, { children: [
+  i.title && /* @__PURE__ */ t(n, { children: /* @__PURE__ */ t(p, { children: i.title }) }),
   /* @__PURE__ */ t(e, { ...i }),
-  r && /* @__PURE__ */ t(p, { onClick: r, children: "View Insight" })
+  r && /* @__PURE__ */ t(l, { onClick: r, children: "View Insight" })
 ] });
 export {
-  j as Tweet
+  a as Tweet
 };

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

@@ -1,42 +1,25 @@
-import { jsxs as n, jsx as o } from "react/jsx-runtime";
-import { useMemo as a } from "react";
-import { TwitterContent as l } from "../../../questions/twitter/index.js";
-import { isValidDate as f, formatDate as d, formatTime as c } from "../../../../utils/common.js";
-import { Container as u, DateTime as p, Quote as s, ActionButton as h } from "./styles.js";
-import "../../../questions/twitter/account/index.js";
+import { jsxs as r, 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";
+import "react";
 import "../../../icons/index.js";
 import "@linaria/react";
+import "../../../video-player/styles.js";
+import "../../../questions/twitter/account/index.js";
+import "../../../../utils/common.js";
 import "../../../questions/twitter/account/styles.js";
 import "../../../questions/twitter/styles.js";
 import "../../../button/index.js";
 import "../../../button/styles.js";
-const M = ({
-  openTweet: m,
-  created: i,
+const k = ({
+  openTweet: o,
   ...t
-}) => {
-  const r = a(() => {
-    if (i) {
-      const e = new Date(i);
-      if (f(e))
-        return {
-          date: d(e),
-          time: c(e)
-        };
-    }
-    return null;
-  }, [i]);
-  return /* @__PURE__ */ n(u, { children: [
-    r && /* @__PURE__ */ n(p, { children: [
-      r.date,
-      " · ",
-      r.time
-    ] }),
-    t.title && /* @__PURE__ */ o(s, { children: t.title }),
-    /* @__PURE__ */ o(l, { ...t }),
-    m && /* @__PURE__ */ o(h, { onClick: () => m(t.tweetId), children: "View Insight" })
-  ] });
-};
+}) => /* @__PURE__ */ r(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" })
+] });
 export {
-  M as Twitter
+  k as Twitter
 };

package/lib/ui/gamification/question/twitter/styles.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
 export declare const Container: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
 export declare const ActionButton: any;
-export declare const DateTime: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
 export declare const Quote: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLQuoteElement> & import("react").BlockquoteHTMLAttributes<HTMLQuoteElement> & Record<never, unknown>>;

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

@@ -1,27 +1,22 @@
-import { styled as s } from "@linaria/react";
-import { Button as o } from "../../../button/index.js";
+import { styled as o } from "@linaria/react";
+import { Button as t } from "../../../button/index.js";
 import "react/jsx-runtime";
 import "../../../button/styles.js";
-const r = /* @__PURE__ */ s("div")({
+const a = /* @__PURE__ */ o("div")({
   name: "Container",
   class: "cl56x6b",
   propsAsIs: !1
-}), t = () => o, c = /* @__PURE__ */ s(t())({
+}), s = () => t, c = /* @__PURE__ */ o(s())({
   name: "ActionButton",
   class: "a11pzf92",
   propsAsIs: !0
-}), m = /* @__PURE__ */ s("div")({
-  name: "DateTime",
-  class: "d1hbaleq",
-  propsAsIs: !1
-}), i = /* @__PURE__ */ s("blockquote")({
+}), i = /* @__PURE__ */ o("blockquote")({
   name: "Quote",
-  class: "qvvgqjm",
+  class: "q1hbaleq",
   propsAsIs: !1
 });
 export {
   c as ActionButton,
-  r as Container,
-  m as DateTime,
+  a as Container,
   i as Quote
 };

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

@@ -18,11 +18,11 @@ const B = ({
   enteredAnActiveQuestion: E,
   marketClosed: N
 }) => {
-  const b = a && (c === n.TRIVIA || c === n.PREDICTION) && m && T !== Q.RESOLVED, x = c === n.PREDICTION && !F, k = N && c === n.PREDICTION && !a && !E || c === n.PREDICTION && y && m && E, D = b && x, O = b && F, R = c === n.PREDICTION && a && m && F, S = a && c === n.POLL && m;
-  if (!u && !w && !D && !O && !k && !S && !R)
+  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)
     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": x, children: [
+  return /* @__PURE__ */ r(f, { "data-isPrediction": k, children: [
     u && /* @__PURE__ */ r(o, { children: [
       /* @__PURE__ */ i(h, { children: /* @__PURE__ */ i(l, { name: "questionExpired" }) }),
       /* @__PURE__ */ r("div", { children: [
@@ -37,7 +37,7 @@ const B = ({
         /* @__PURE__ */ i(s, { children: "This question was answered after the moderator closed the question. So the points for this answer won’t tally." })
       ] })
     ] }),
-    k && /* @__PURE__ */ r(o, { children: [
+    x && /* @__PURE__ */ r(o, { children: [
       /* @__PURE__ */ i(h, { children: /* @__PURE__ */ i(l, { name: "questionExpired" }) }),
       /* @__PURE__ */ r("div", { children: [
         /* @__PURE__ */ i(p, { children: /* @__PURE__ */ i(d, { children: "Question Closed" }) }),
@@ -50,7 +50,7 @@ const B = ({
     ] }),
     S && /* @__PURE__ */ r(o, { children: [
       /* @__PURE__ */ i(h, { "data-feedback-type": "correct", children: /* @__PURE__ */ i(l, { name: "correct" }) }),
-      /* @__PURE__ */ i(d, { children: "That's for answering. Please stay tuned for the next question." })
+      /* @__PURE__ */ i(d, { children: "Thanks for answering. Please stay tuned for the next question." })
     ] }),
     (O || R) && /* @__PURE__ */ r(o, { children: [
       /* @__PURE__ */ i(h, { "data-feedback-type": P, children: /* @__PURE__ */ i(l, { name: P }) }),