@streamlayer/react-ui 1.11.3 → 1.12.0

package/lib/ui/gamification/vote/vote-option/index.js

@@ -1,94 +1,95 @@
-import { jsx as e, jsxs as l } from "react/jsx-runtime";
-import { useState as j, useLayoutEffect as U } from "react";
-import { QuestionImages as a, QuestionType as o, QuestionStatus as p } from "@streamlayer/sdk-web-types";
+import { jsx as e, jsxs as f } from "react/jsx-runtime";
+import { useState as y, useLayoutEffect as U } from "react";
+import { QuestionImages as a, QuestionType as i, QuestionStatus as D } from "@streamlayer/sdk-web-types";
 import { AnimatedCounter as W } from "../../../animated-counter/index.js";
-import { IconDefault as $, IconContainer as y, IconWrap as F, IconCircle as M, ButtonContainer as z, ButtonPctWrap as G, ButtonPct as H, ButtonBody as J, Title as K, Pts as X, Indicators as Y, CheckIcon as Z, Percentage as _ } from "./styles.js";
-const h = {
+import { IconDefault as $, IconContainer as F, IconWrap as M, IconCircle as z, ButtonContainer as G, ButtonPctWrap as H, ButtonPct as J, ButtonBody as K, Title as X, Pts as Y, Indicators as Z, CheckIcon as _, Percentage as q } from "./styles.js";
+const E = {
   [a.CENTERED]: (t) => /* @__PURE__ */ e($, { "data-testid": "vote-icon", alt: "option-icon", src: t }),
-  [a.TRANSPARENT]: (t) => /* @__PURE__ */ e(y, { "data-testid": "vote-icon", children: /* @__PURE__ */ e(F, { style: { backgroundImage: `url(${t})` } }) }),
-  [a.ROUNDED]: (t) => /* @__PURE__ */ e(M, { "data-testid": "vote-icon", alt: "option-icon", src: t }),
+  [a.TRANSPARENT]: (t) => /* @__PURE__ */ e(F, { "data-testid": "vote-icon", children: /* @__PURE__ */ e(M, { style: { backgroundImage: `url(${t})` } }) }),
+  [a.ROUNDED]: (t) => /* @__PURE__ */ e(z, { "data-testid": "vote-icon", alt: "option-icon", src: t }),
   [a.NONE]: () => null,
   [a.UNSET]: () => null
-}, q = ({ questionType: t, hasCorrectAnswer: c, correct: n, youVoted: r, questionVoted: i }) => {
-  if (t === o.POLL && r)
-    return "correct";
-  if (t === o.PREDICTION) {
-    if (c && i)
-      return r ? n ? "correct" : "incorrect" : "unset";
-    if (r)
+}, tt = ({ questionType: t, hasCorrectAnswer: c, correct: n, youVoted: o, questionVoted: r }) => {
+  if (t === i.POLL && o)
+    return "voted";
+  if (t === i.PREDICTION) {
+    if (c && r)
+      return o ? n ? "correct" : "incorrect" : "unset";
+    if (o)
       return "correct";
   }
-  return t === o.TRIVIA && i && r ? n ? "correct" : "incorrect" : "unset";
-}, tt = ({
+  return t === i.TRIVIA && r && o ? n ? "correct" : "incorrect" : "unset";
+}, et = ({
   questionType: t,
   questionVoted: c,
   correct: n,
-  hasCorrectAnswer: r,
-  questionStatus: i
-}) => t === o.TRIVIA ? c && n : t === o.PREDICTION ? c && n && r || i === p.RESOLVED && n : !1, ct = (t) => {
-  var S;
+  hasCorrectAnswer: o,
+  questionStatus: r
+}) => t === i.TRIVIA ? c && n : t === i.PREDICTION ? c && n && o || r === D.RESOLVED && n : !1, st = (t) => {
+  var p;
   const {
     // option props
     id: c,
     icon: n,
-    text: r,
-    percentageDecimal: i,
-    points: D,
+    text: o,
+    percentageDecimal: r,
+    points: g,
     // extra props
     onVote: w,
     markThatVoted: A,
-    onPercentsAnimated: f,
-    youSelected: E,
+    onPercentsAnimated: I,
+    youSelected: m,
+    youVoted: O,
     questionVoted: s,
     imageMode: C,
-    answerTimeExpired: O,
+    answerTimeExpired: v,
     questionStatus: P,
-    isLoading: g,
+    isLoading: k,
     questionType: d,
-    correct: v,
-    hasCorrectAnswer: k,
-    votedAfterQuestionClosed: x,
+    correct: x,
+    hasCorrectAnswer: L,
+    votedAfterQuestionClosed: B,
     enteredAnActiveQuestion: R,
-    marketClosed: I
-  } = t, [L, T] = j(0), m = q(t), B = tt({ questionType: d, questionVoted: s, correct: v, hasCorrectAnswer: k, questionStatus: P }), u = I && d === o.PREDICTION, N = s || u, Q = d === o.PREDICTION && !s && !I, V = s && !E && m !== "incorrect";
-  return U(() => {
+    marketClosed: h
+  } = t, [Q, T] = y(0), l = tt(t), V = et({ questionType: d, questionVoted: s, correct: x, hasCorrectAnswer: L, questionStatus: P }), u = h && d === i.PREDICTION, N = s || u, b = d === i.PREDICTION && !s && !h, S = s && !m && l !== "incorrect" && !O;
+  return console.log({ isNotChecked: S, questionVoted: s, youSelected: m, answerState: l }), U(() => {
     T(0), requestAnimationFrame(() => {
-      T(i);
+      T(r);
     });
-  }, [i]), /* @__PURE__ */ l(
-    z,
+  }, [r]), /* @__PURE__ */ f(
+    G,
     {
       value: c,
-      "data-selected": E,
-      "data-answer-state": m,
-      disabled: s || g || O || u && !R || u && R && x,
-      "data-is-not-checked": V,
-      onClick: (b) => {
+      "data-selected": m,
+      "data-answer-state": l,
+      disabled: s || k || v || u && !R || u && R && B,
+      "data-is-not-checked": S,
+      onClick: (j) => {
         A(
-          d === o.PREDICTION ? I : P === p.RESOLVED
-        ), w(b);
+          d === i.PREDICTION ? h : P === D.RESOLVED
+        ), w(j);
       },
       children: [
-        /* @__PURE__ */ e(G, { children: /* @__PURE__ */ e(
-          H,
+        /* @__PURE__ */ e(H, { children: /* @__PURE__ */ e(
+          J,
           {
-            "data-answer-state": m,
-            style: { width: `${N ? L : 0}%` },
+            "data-answer-state": l,
+            style: { width: `${N ? Q : 0}%` },
             onTransitionEnd: () => {
-              u || f == null || f();
+              u || I == null || I();
             }
           }
         ) }),
-        /* @__PURE__ */ l(J, { children: [
-          n && C && ((S = h[C]) == null ? void 0 : S.call(h, n)),
-          /* @__PURE__ */ e(K, { children: r }),
-          Q && /* @__PURE__ */ l("div", { children: [
-            D,
-            /* @__PURE__ */ e(X, { children: "pts" })
+        /* @__PURE__ */ f(K, { children: [
+          n && C && ((p = E[C]) == null ? void 0 : p.call(E, n)),
+          /* @__PURE__ */ e(X, { children: o }),
+          b && /* @__PURE__ */ f("div", { children: [
+            g,
+            /* @__PURE__ */ e(Y, { children: "pts" })
           ] }),
-          N && /* @__PURE__ */ l(Y, { children: [
-            B && /* @__PURE__ */ e(Z, { name: "selected" }),
-            /* @__PURE__ */ e(_, { children: /* @__PURE__ */ e(W, { value: i, suffix: "%" }) })
+          N && /* @__PURE__ */ f(Z, { children: [
+            V && /* @__PURE__ */ e(_, { name: "selected" }),
+            /* @__PURE__ */ e(q, { children: /* @__PURE__ */ e(W, { value: r, suffix: "%" }) })
           ] })
         ] })
       ]
@@ -96,5 +97,5 @@ const h = {
   );
 };
 export {
-  ct as VotingOption
+  st as VotingOption
 };

package/lib/ui/icons/index.d.ts

@@ -37,6 +37,7 @@ export declare const icons: {
     'icon-btn-leaderboard': any;
     'icon-arrow': any;
     'icon-twitter-verified': any;
+    dashboard: any;
     correct: any;
     incorrect: any;
     questionExpired: any;