@streamlayer/react-ui 0.68.0 → 0.68.1

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

@@ -1,10 +1,10 @@
-import { jsx as i, jsxs as g, Fragment as O } from "react/jsx-runtime";
+import { jsx as a, jsxs as q, Fragment as u } from "react/jsx-runtime";
 import { useState as l, useCallback as C, useMemo as n } from "react";
 import { QuestionType as v } from "@streamlayer/sdk-web-types";
-import { SDKScrollContainer as b } from "../../app/styles.js";
-import { ExpiredAlert as u } from "./expired-alert/index.js";
-import { Feedback as M } from "./feedback/index.js";
-import { Container as j, Content as k, Title as D, Options as P } from "./styles.js";
+import { SDKScrollContainer as O } from "../../app/styles.js";
+import { ExpiredAlert as b } from "./expired-alert/index.js";
+import { Feedback as D } from "./feedback/index.js";
+import { Container as M, Content as P, Title as j, Options as k } from "./styles.js";
 import { VotingOption as F } from "./vote-option/index.js";
 import { WinBar as L } from "./win-bar/index.js";
 import "@linaria/react";
@@ -19,18 +19,18 @@ import "react-countdown-circle-timer";
 import "../../theme/constants.js";
 import "./win-bar/styles.js";
 const st = ({ openedQuestion: t, vote: f, close: p }) => {
-  var q;
-  const E = t.subject, V = t.type, m = (q = t.options) == null ? void 0 : q.options, [s, A] = l(!1), [d, T] = l(!1), [w, h] = l(""), e = t == null ? void 0 : t.id, y = C(
+  var g;
+  const E = t.subject, V = t.type, m = (g = t.options) == null ? void 0 : g.options, [s, A] = l(!1), [T, d] = l(!1), [w, y] = l(""), e = t == null ? void 0 : t.id, h = C(
     async (r) => {
       if (e) {
         const c = r.currentTarget.value;
-        h(c), T(!0), await f(e, c), T(!1);
+        y(c), d(!0), await f(e, c), d(!1);
       }
     },
-    [e, h, f]
+    [e, y, f]
   ), I = C(() => {
     A(!0), setTimeout(p, 3e3);
-  }, [p]), a = n(
+  }, [p]), i = n(
     () => t == null ? void 0 : t.answers.find((r) => r.youVoted === !0),
     [t]
   ), o = n(
@@ -40,48 +40,50 @@ const st = ({ openedQuestion: t, vote: f, close: p }) => {
     var c;
     return {
       ...r,
-      questionVoted: !!a,
+      questionVoted: !!i,
       youSelected: w === r.id,
-      isLoading: d,
+      isLoading: T,
       hasCorrectAnswer: o,
       questionType: t.type,
       answerTimeExpired: s,
       questionStatus: t.status,
       imageMode: (c = t.appearance) == null ? void 0 : c.images,
       // ToDo: Figure out why imageMode is not in the response
-      onVote: y
+      onVote: h
     };
-  }) : [], [o, s, d, t, a, y, w]), x = m && (m.case === "trivia" || m.case === "prediction") ? m.value : void 0;
-  return /* @__PURE__ */ i(b, { "data-question-header": "true", children: /* @__PURE__ */ i(j, { children: /* @__PURE__ */ g(k, { children: [
-    x && /* @__PURE__ */ i(
-      M,
+  }) : [], [o, s, T, t, i, h, w]), x = m && (m.case === "trivia" || m.case === "prediction") ? m.value : void 0;
+  return /* @__PURE__ */ a(O, { "data-question-header": "true", children: /* @__PURE__ */ a(M, { children: /* @__PURE__ */ q(P, { children: [
+    x && /* @__PURE__ */ a(
+      D,
       {
         feedbackMessages: x,
-        questionVoted: !!a,
-        questionVotedCorrectly: a == null ? void 0 : a.correct,
+        questionVoted: !!i,
+        questionVotedCorrectly: i == null ? void 0 : i.correct,
         questionType: V,
         hasCorrectAnswer: o,
         questionStatus: t.status
       }
     ),
-    t.type !== v.PREDICTION && /* @__PURE__ */ i(
+    t.type !== v.PREDICTION && /* @__PURE__ */ a(
       L,
       {
         title: s ? "Time expired" : "To win",
         points: s ? void 0 : 100,
         onTimerExpired: I,
-        isTimer: !0
+        isTimer: !0,
+        isPlayingTimer: !i,
+        timerDuration: i ? 0 : 30
       }
     ),
-    s ? /* @__PURE__ */ i(
-      u,
+    s ? /* @__PURE__ */ a(
+      b,
       {
         title: "More to come...",
         description: "Watch for additional enhanced stream interactive experience."
       }
-    ) : /* @__PURE__ */ g(O, { children: [
-      /* @__PURE__ */ i(D, { "data-isPrediction": t.type === v.PREDICTION, children: E }),
-      /* @__PURE__ */ i(P, { children: S.map((r) => /* @__PURE__ */ i(F, { ...r }, r.id)) })
+    ) : /* @__PURE__ */ q(u, { children: [
+      /* @__PURE__ */ a(j, { "data-isPrediction": t.type === v.PREDICTION, children: E }),
+      /* @__PURE__ */ a(k, { children: S.map((r) => /* @__PURE__ */ a(F, { ...r }, r.id)) })
     ] })
   ] }) }) });
 };

package/lib/ui/gamification/vote/win-bar/index.d.ts

@@ -4,6 +4,7 @@ interface WinBarProps {
     points?: number;
     isPlayingTimer?: boolean;
     isTimer?: boolean;
+    timerDuration?: number;
     onTimerExpired?: () => void;
 }
 export declare const WinBar: React.FC<WinBarProps>;

package/lib/ui/gamification/vote/win-bar/index.js

@@ -1,24 +1,31 @@
-import { jsxs as r, jsx as i, Fragment as c } from "react/jsx-runtime";
+import { jsxs as r, jsx as i, Fragment as d } from "react/jsx-runtime";
 import { Timer as p } from "../../../timer/index.js";
-import { WinBarContainer as d, Content as h, Title as l, WinIcon as s, Points as a, PointsCount as P, PointsUnits as f } from "./styles.js";
+import { WinBarContainer as h, Content as l, Title as s, WinIcon as a, Points as P, PointsCount as f, PointsUnits as u } from "./styles.js";
 import "@linaria/react";
 import "react";
 import "react-countdown-circle-timer";
 import "../../../theme/constants.js";
 import "../../../icons/index.js";
-const B = ({ title: n, points: o, isPlayingTimer: t, isTimer: e, onTimerExpired: m }) => /* @__PURE__ */ r(d, { children: [
-  /* @__PURE__ */ r(h, { children: [
-    n && /* @__PURE__ */ i(l, { children: n }),
-    o !== void 0 && /* @__PURE__ */ r(c, { children: [
-      /* @__PURE__ */ i(s, { name: "icon-trophy" }),
-      /* @__PURE__ */ r(a, { children: [
-        /* @__PURE__ */ i(P, { children: o }),
-        /* @__PURE__ */ i(f, { children: "PTS" })
+const v = ({
+  title: n,
+  points: o,
+  isPlayingTimer: t,
+  isTimer: e,
+  timerDuration: m,
+  onTimerExpired: c
+}) => /* @__PURE__ */ r(h, { children: [
+  /* @__PURE__ */ r(l, { children: [
+    n && /* @__PURE__ */ i(s, { children: n }),
+    o !== void 0 && /* @__PURE__ */ r(d, { children: [
+      /* @__PURE__ */ i(a, { name: "icon-trophy" }),
+      /* @__PURE__ */ r(P, { children: [
+        /* @__PURE__ */ i(f, { children: o }),
+        /* @__PURE__ */ i(u, { children: "PTS" })
       ] })
     ] })
   ] }),
-  e && /* @__PURE__ */ i(p, { isPlaying: t, onTimerExpired: m })
+  e && /* @__PURE__ */ i(p, { isPlaying: t, onTimerExpired: c, duration: m })
 ] });
 export {
-  B as WinBar
+  v as WinBar
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamlayer/react-ui",
-  "version": "0.68.0",
+  "version": "0.68.1",
   "type": "module",
   "main": "./src/index.js",
   "typings": "./lib/index.d.ts",
@@ -42,10 +42,10 @@
     "react-window-infinite-loader": "^1.0.9",
     "@streamlayer/feature-gamification": "^0.26.5",
     "@streamlayer/sdk-web": "^0.28.27",
-    "@streamlayer/sdk-web-anonymous-auth": "^0.11.22",
     "@streamlayer/sdk-web-api": "^0.0.1",
     "@streamlayer/sdk-web-core": "^0.0.3",
     "@streamlayer/sdk-web-features": "^0.10.30",
+    "@streamlayer/sdk-web-anonymous-auth": "^0.11.22",
     "@streamlayer/sdk-web-interfaces": "^0.0.1",
     "@streamlayer/sdk-web-notifications": "^0.13.3",
     "@streamlayer/sdk-web-storage": "^0.0.4",
@@ -89,6 +89,6 @@
     "vite-plugin-svgr": "^4.1.0",
     "vite-svg-loader": "^4.0.0",
     "vite-tsconfig-paths": "^4.2.1",
-    "@streamlayer/react": "^0.31.0"
+    "@streamlayer/react": "^0.31.1"
   }
 }