@streamlayer/react-ui 0.27.2 → 0.28.0

package/lib/fedex-a8dcc7b2.js

@@ -0,0 +1,4 @@
+const M = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjgiIGhlaWdodD0iMjIiIHZpZXdCb3g9IjAgMCA2OCAyMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlZlY3RvciI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNTYuNjE1NSA3LjQ0MTQ2SDUwLjcwNjZMNTYuMzA3MiAxMy44NjE1TDUwLjcwNjYgMjAuMjgwNUg1Ni40MzU3TDU5LjE1ODcgMTcuMTM3TDYxLjkwNjggMjAuMjgwNUg2Ny44NEw2Mi4xOSAxMy44MzQ4TDY3Ljc2MzYgNy40NDE0Nkg2Mi4wNjA2TDU5LjM4OTcgMTAuNTYwMkw1Ni42MTU1IDcuNDQxNDZaTTYyLjI3MjEgNy45MTY1OUw1OS4zOTY0IDExLjI3NDdMNTYuNDA5MiA3LjkxNjU5SDUxLjc0NDZMNTYuOTMwNyAxMy44NjE1TDUxLjc0NDcgMTkuODA1NEg1Ni4yMjU3TDU5LjE1NzEgMTYuNDIxM0w2Mi4xMTU2IDE5LjgwNTRINjYuNzk4N0w2MS41NjYgMTMuODM1N0w2Ni43MjYxIDcuOTE2NTlINjIuMjcyMVoiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNDQuMzYzNSA3LjQ0MTQ2VjQuNTY0MDZINTAuNzA2NlYwLjA1NTk5OThIMzkuNzAyVjIwLjI4MDVINTAuNzA2NlYxNS43NjAxSDQ0LjM2MzVWMTEuNzc5NEg1MC43MDY2VjcuNDQxNDZINDQuMzYzNVpNNTAuMjQwOCA3LjkxNjU5SDQzLjg5NzhWNC4wODg5M0g1MC4yNDA4VjAuNTMxMTMySDQwLjE2NzhWMTkuODA1NEg1MC4yNDA4VjE2LjIzNTJINDMuODk3OFYxMS4zMDQzSDUwLjI0MDhWNy45MTY1OVoiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGQ9Ik0zNS4wNiAwLjA1NTk5OThWOC4zMzI4MUgzNS4wMDg3QzMzLjk4MDMgNy4xMjc4NyAzMi42OTY2IDYuNzA4ODEgMzEuMjA3IDYuNzA4ODFDMjguMTU1MiA2LjcwODgxIDI1Ljg1NjEgOC44MjYgMjUuMDQ5MyAxMS42MjM2QzI0LjEyOCA4LjU0MDkyIDIxLjc1NDQgNi42NTA4NCAxOC4yMzQ5IDYuNjUwODRDMTUuMzc2OSA2LjY1MDg0IDEzLjExOTcgNy45NTkzNiAxMS45NDIyIDEwLjA5MThWNy40NDE0Nkg2LjAzNDE2VjQuNTY0MDZIMTIuNDgxNVYwLjA1NTk5OThIMC43NjgwMDVWMjAuMjgwNUg2LjAzNDE2VjExLjc3OTRIMTEuMjgzNkMxMS4xMjcgMTIuNDAzNyAxMS4wNDMyIDEzLjA3MjcgMTEuMDQzMiAxMy43Nzg4QzExLjA0MzIgMTcuOTk3IDE0LjIwMzEgMjAuOTU4IDE4LjIzNDkgMjAuOTU4QzIxLjYyNTggMjAuOTU4IDIzLjg2MDcgMTkuMzM0IDI1LjA0MTkgMTYuMzc0SDIwLjUyODRDMTkuOTE4MyAxNy4yNjQ0IDE5LjQ1NTMgMTcuNTI3NiAxOC4yMzQ5IDE3LjUyNzZDMTYuODE5OSAxNy41Mjc2IDE1LjU5OTUgMTYuMjY4NSAxNS41OTk1IDE0Ljc3NTZIMjQuNzg5NEMyNS4xODgxIDE4LjEyNjIgMjcuNzQ3MiAyMS4wMTYgMzEuMjU4MiAyMS4wMTZDMzIuNzczIDIxLjAxNiAzNC4xNjAxIDIwLjI1NTggMzUuMDA3OCAxOC45NzI5SDM1LjA1OVYyMC4yODI0SDM5LjcwMUwzOS43MDIgMC4wNTU5OTk4SDM1LjA2Wk0xNS43NDY3IDExLjgzOTNDMTYuMDM5MiAxMC41NTQ1IDE3LjAxNjQgOS43MTU0NSAxOC4yMzU4IDkuNzE1NDVDMTkuNTc4MiA5LjcxNTQ1IDIwLjUwNTEgMTAuNTI4OSAyMC43NDkyIDExLjgzOTNDMjAuODUxNyAxMS44MzkzIDE1Ljc0NjcgMTEuODM5MyAxNS43NDY3IDExLjgzOTNaTTMyLjI0MiAxNy4yMDE2QzMwLjUzMDcgMTcuMjAxNiAyOS40NjY4IDE1LjU3NDggMjkuNDY2OCAxMy44NzY3QzI5LjQ2NjggMTIuMDYxNyAzMC4zOTE5IDEwLjMxNiAzMi4yNDIgMTAuMzE2QzM0LjE2MDEgMTAuMzE2IDM0LjkyNCAxMi4wNjE3IDM0LjkyNCAxMy44NzY3QzM0LjkyNCAxNS41OTc2IDM0LjExNDQgMTcuMjAxNiAzMi4yNDIgMTcuMjAxNloiIGZpbGw9IndoaXRlIi8+CjwvZz4KPC9zdmc+Cg==";
+export {
+  M as i
+};

package/lib/index.js

@@ -1,16 +1,16 @@
-import { QuestionInApp as Vo } from "./ui/notifications/notification/question-inapp/index.js";
-import { Login as No } from "./ui/login/index.js";
-import { Onboarding as Uo } from "./ui/gamification/onboarding/index.js";
-import { ActivePages as ko, Navigation as qo } from "./ui/gamification/navigation/index.js";
-import { LeaderboardItemDetail as zo } from "./ui/gamification/leaderboard-item-detail/index.js";
-import { Question as Co } from "./ui/gamification/question/index.js";
-import { QuestionList as Fo } from "./ui/gamification/question-list/index.js";
-import { UserStatistics as Ho } from "./ui/gamification/user-statistics/index.js";
-import { Vote as Ko } from "./ui/gamification/vote/index.js";
-import { Demo as Ro } from "./ui/demo/index.js";
-import { Points as Xo } from "./ui/gamification/points/index.js";
-import { StreamLayerThemeProvider as Zo } from "./ui/theme/index.js";
-import { ThemeVariables as $o, theme as or, themeStr as rr } from "./ui/theme/theme.js";
+import { QuestionInApp as yo } from "./ui/notifications/notification/question-inapp/index.js";
+import { Login as Oo } from "./ui/login/index.js";
+import { Onboarding as jo } from "./ui/gamification/onboarding/index.js";
+import { ActivePages as qo, Navigation as wo } from "./ui/gamification/navigation/index.js";
+import { LeaderboardItemDetail as Bo } from "./ui/gamification/leaderboard-item-detail/index.js";
+import { Question as Eo } from "./ui/gamification/question/index.js";
+import { QuestionList as Go } from "./ui/gamification/question-list/index.js";
+import { UserStatistics as Jo } from "./ui/gamification/user-statistics/index.js";
+import { Vote as Mo } from "./ui/gamification/vote/index.js";
+import { Demo as Wo } from "./ui/demo/index.js";
+import { Points as Yo } from "./ui/gamification/points/index.js";
+import { StreamLayerThemeProvider as _o } from "./ui/theme/index.js";
+import { ThemeVariables as or, theme as rr, themeStr as tr } from "./ui/theme/theme.js";
 import "react/jsx-runtime";
 import "react";
 import "./icon-exit-6a55bb8f.js";
@@ -69,6 +69,7 @@ import "./ui/gamification/vote/components/voting-header/index.js";
 import "./ui/gamification/vote/components/voting-header/styles.js";
 import "./ui/gamification/vote/components/voting-header/components/points/index.js";
 import "./ui/gamification/vote/components/voting-header/components/points/styles.js";
+import "./fedex-a8dcc7b2.js";
 import "./ui/gamification/insight/styles.js";
 import "./ui/gamification/insight-list/styles.js";
 import "./ui/gamification/detailed-insight/styles.js";
@@ -91,20 +92,20 @@ import "./ui/gamification/points/styles.js";
 import "./ui/icons/index.js";
 import "@linaria/core";
 export {
-  ko as ActivePages,
-  Ro as Demo,
-  zo as LeaderboardItemDetail,
-  No as Login,
-  qo as Navigation,
-  Uo as Onboarding,
-  Xo as Points,
-  Co as Question,
-  Vo as QuestionInApp,
-  Fo as QuestionList,
-  Zo as StreamLayerThemeProvider,
-  $o as ThemeVariables,
-  Ho as UserStatistics,
-  Ko as Vote,
-  or as theme,
-  rr as themeStr
+  qo as ActivePages,
+  Wo as Demo,
+  Bo as LeaderboardItemDetail,
+  Oo as Login,
+  wo as Navigation,
+  jo as Onboarding,
+  Yo as Points,
+  Eo as Question,
+  yo as QuestionInApp,
+  Go as QuestionList,
+  _o as StreamLayerThemeProvider,
+  or as ThemeVariables,
+  Jo as UserStatistics,
+  Mo as Vote,
+  rr as theme,
+  tr as themeStr
 };

package/lib/ui/app/Features/FeatureProvider.js

@@ -0,0 +1,14 @@
+import { jsx as t } from "react/jsx-runtime";
+import { FeatureStatus as u } from "@streamlayer/sdk-web-interfaces";
+import { useStore as e } from "@nanostores/react";
+const c = ({
+  feature: i,
+  sdk: o,
+  children: n
+}) => {
+  const d = e(i.status), { slStreamId: r } = e(o.sdkStore);
+  return r != null && r.loading ? /* @__PURE__ */ t("div", { children: "event is loading..." }) : r != null && r.data ? d !== u.Ready ? /* @__PURE__ */ t("div", { children: "wait feature..." }) : n : /* @__PURE__ */ t("div", { children: "event is forbidden..." });
+};
+export {
+  c as FeatureProvider
+};

package/lib/ui/app/Features/Gamification/Leaderboard.js

@@ -0,0 +1,48 @@
+import { jsx as e, jsxs as c, Fragment as l } from "react/jsx-runtime";
+import { useStore as u } from "@nanostores/react";
+import { useState as b } from "react";
+import { LeaderboardItemDetail as f } from "../../../gamification/leaderboard-item-detail/index.js";
+import { LeaderboardList as I } from "../../../gamification/leaderboard-list/index.js";
+import "../../../gamification/common-header/index.js";
+import "../../../../icon-exit-6a55bb8f.js";
+import "../../../gamification/common-header/styles.js";
+import "@linaria/react";
+import "../../../gamification/user-statistics/index.js";
+import "../../../../utils/common.js";
+import "../../../gamification/user-statistics/components/statistics/index.js";
+import "../../../gamification/user-statistics/components/statistics/styles.js";
+import "../../../gamification/user-statistics/components/rank/index.js";
+import "../../../gamification/user-statistics/components/rank/styles.js";
+import "../../../gamification/user-statistics/styles.js";
+import "../../../gamification/leaderboard-item-detail/styles.js";
+import "../../../gamification/leaderboard-invite-link/index.js";
+import "../../../gamification/leaderboard-invite-link/styles.js";
+import "../../../gamification/leaderboard-item/index.js";
+import "../../../gamification/leaderboard-item/styles.js";
+import "../../../gamification/leaderboard-list/styles.js";
+const M = ({ store: p }) => {
+  const { data: r } = u(p), [i, s] = b(void 0);
+  if (!r)
+    return /* @__PURE__ */ e("div", { children: "wait leader board..." });
+  const o = (t) => {
+    var m;
+    const d = (m = r.find((n) => {
+      var a;
+      return ((a = n.attributes) == null ? void 0 : a.userId) === t;
+    })) == null ? void 0 : m.attributes;
+    s(d);
+  };
+  return /* @__PURE__ */ c(l, { children: [
+    i && /* @__PURE__ */ e(f, { comeBack: () => o(null), ...i }),
+    !i && /* @__PURE__ */ e(
+      I,
+      {
+        items: r.filter((t) => t.attributes).map((t) => t.attributes),
+        openItemDetail: o
+      }
+    )
+  ] });
+};
+export {
+  M as Leaderboard
+};

package/lib/ui/app/Features/Gamification/Question.js

@@ -0,0 +1,102 @@
+import { jsx as o, jsxs as n } from "react/jsx-runtime";
+import { styled as y } from "@linaria/react";
+import { useState as d, useCallback as x, useMemo as c } from "react";
+import { Vote as g } from "../../../gamification/vote/index.js";
+import { VotingHeader as h } from "../../../gamification/vote/components/voting-header/index.js";
+import { i as b } from "../../../../fedex-a8dcc7b2.js";
+import "@streamlayer/sdk-web-types";
+import "../../../../index-7045fbb2.js";
+import "../../../gamification/vote/components/voting-option/styles.js";
+import "../../../gamification/vote/styles.js";
+import "../../../../icon-exit-6a55bb8f.js";
+import "../../../gamification/vote/components/voting-header/components/timer/index.js";
+import "react-countdown-circle-timer";
+import "../../../theme/constants.js";
+import "../../../gamification/vote/components/voting-header/components/timer/styles.js";
+import "../../../gamification/vote/components/voting-header/styles.js";
+import "../../../gamification/vote/components/voting-header/components/points/index.js";
+import "../../../gamification/vote/components/voting-header/components/points/styles.js";
+const k = y.div`
+  position: absolute;
+  top: 0;
+  background: var(--color-transparent-item);
+  width: 100%;
+  height: 100%;
+
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  flex-direction: column;
+
+  > div {
+    width: 100%;
+    background: #000;
+    animation: slide-in 0.3s ease-in;
+  }
+
+  @keyframes slide-in {
+    from {
+      transform: translateX(-100%);
+    }
+
+    to {
+      transform: translateX(0);
+    }
+  }
+`, F = ({ openedQuestion: t, closeQuestion: a, vote: e }) => {
+  var s;
+  const [l, m] = d(!1), p = x(
+    (i) => {
+      m(i);
+    },
+    [m]
+  ), r = c(
+    () => t == null ? void 0 : t.answers.find((i) => i.youVoted === !0),
+    [t]
+  ), f = c(
+    () => !!(t != null && t.answers.find((i) => i.correct === !0)),
+    [t]
+  );
+  return t ? /* @__PURE__ */ o(k, { children: /* @__PURE__ */ n("div", { children: [
+    /* @__PURE__ */ o(
+      h,
+      {
+        points: (r == null ? void 0 : r.points) || 0,
+        questionAnswered: !!r,
+        questionAnsweredCorrectly: r == null ? void 0 : r.correct,
+        logo: b,
+        closeQuestion: a,
+        setTimeToExpire: p,
+        questionType: t.type
+      }
+    ),
+    /* @__PURE__ */ o("div", { children: /* @__PURE__ */ o(
+      g,
+      {
+        title: t.subject,
+        feedbackMessages: (s = t.options) == null ? void 0 : s.options.value,
+        questionType: t.type,
+        questionId: t.id,
+        questionAnswered: !!r,
+        questionAnsweredCorrectly: r == null ? void 0 : r.correct,
+        options: t.answers.map((i) => ({
+          id: i.id,
+          title: i.text,
+          icon: i.icon,
+          type: t.type,
+          correct: i.correct,
+          percentage: i.percentage,
+          answered: i.youVoted,
+          disabled: !!r || t.marketClosed || l,
+          questionAnswered: !!r,
+          hasCorrectAnswer: f,
+          points: i.points,
+          onVote: e
+        }))
+      }
+    ) })
+  ] }) }) : null;
+};
+export {
+  F as Question
+};

package/lib/ui/app/Features/Gamification/QuestionsList.js

@@ -0,0 +1,16 @@
+import { jsx as o } from "react/jsx-runtime";
+import { useStore as m } from "@nanostores/react";
+import { QuestionList as s } from "../../../gamification/question-list/index.js";
+import "../../../gamification/question/index.js";
+import "@streamlayer/sdk-web-types";
+import "../../../../icon-chevron-138a557c.js";
+import "../../../gamification/question/styles.js";
+import "@linaria/react";
+import "../../../gamification/question-list/styles.js";
+const L = ({ store: r, openQuestion: i }) => {
+  const t = m(r);
+  return t != null && t.data ? /* @__PURE__ */ o(s, { openQuestion: i, questions: t.data }) : /* @__PURE__ */ o("div", { children: "wait questions..." });
+};
+export {
+  L as QuestionsList
+};

package/lib/ui/app/Features/Gamification/Tabs.js

@@ -0,0 +1,47 @@
+import { jsxs as e, Fragment as i, jsx as t } from "react/jsx-runtime";
+import { useState as s } from "react";
+import { ActivePages as m, Navigation as a } from "../../../gamification/navigation/index.js";
+import { UserSummary as n } from "./UserSummary.js";
+import { QuestionsList as u } from "./QuestionsList.js";
+import { Leaderboard as g } from "./Leaderboard.js";
+import "../../../gamification/navigation/styles.js";
+import "@linaria/react";
+import "@nanostores/react";
+import "../../../gamification/user-statistics/index.js";
+import "../../../../utils/common.js";
+import "../../../gamification/user-statistics/components/statistics/index.js";
+import "../../../gamification/user-statistics/components/statistics/styles.js";
+import "../../../gamification/user-statistics/components/rank/index.js";
+import "../../../gamification/user-statistics/components/rank/styles.js";
+import "../../../gamification/user-statistics/styles.js";
+import "../../../gamification/question-list/index.js";
+import "../../../gamification/question/index.js";
+import "@streamlayer/sdk-web-types";
+import "../../../../icon-chevron-138a557c.js";
+import "../../../gamification/question/styles.js";
+import "../../../gamification/question-list/styles.js";
+import "../../../gamification/leaderboard-item-detail/index.js";
+import "../../../gamification/common-header/index.js";
+import "../../../../icon-exit-6a55bb8f.js";
+import "../../../gamification/common-header/styles.js";
+import "../../../gamification/leaderboard-item-detail/styles.js";
+import "../../../gamification/leaderboard-list/index.js";
+import "../../../gamification/leaderboard-invite-link/index.js";
+import "../../../gamification/leaderboard-invite-link/styles.js";
+import "../../../gamification/leaderboard-item/index.js";
+import "../../../gamification/leaderboard-item/styles.js";
+import "../../../gamification/leaderboard-list/styles.js";
+const J = ({ gamification: r }) => {
+  const [o, p] = s(m.HOME);
+  return /* @__PURE__ */ e(i, { children: [
+    /* @__PURE__ */ t(a, { activePage: o, toggleActivePage: p }),
+    o === m.HOME && /* @__PURE__ */ e(i, { children: [
+      /* @__PURE__ */ t(n, { store: r.userSummary.getStore() }),
+      /* @__PURE__ */ t(u, { openQuestion: r.openQuestion, store: r.questions.getStore() })
+    ] }),
+    o === m.LEADERBOARD && /* @__PURE__ */ t(g, { store: r.leaderboardList.getStore() })
+  ] });
+};
+export {
+  J as Tabs
+};

package/lib/ui/app/Features/Gamification/UserSummary.js

@@ -0,0 +1,17 @@
+import { jsx as t } from "react/jsx-runtime";
+import { useStore as o } from "@nanostores/react";
+import { UserStatistics as i } from "../../../gamification/user-statistics/index.js";
+import "../../../../utils/common.js";
+import "../../../gamification/user-statistics/components/statistics/index.js";
+import "../../../gamification/user-statistics/components/statistics/styles.js";
+import "@linaria/react";
+import "../../../gamification/user-statistics/components/rank/index.js";
+import "../../../gamification/user-statistics/components/rank/styles.js";
+import "../../../gamification/user-statistics/styles.js";
+const S = ({ store: m }) => {
+  const { data: r } = o(m);
+  return r != null && r.summary ? /* @__PURE__ */ t(i, { ...r.summary, ...r.percentage }) : /* @__PURE__ */ t("div", { children: "wait user..." });
+};
+export {
+  S as UserSummary
+};

package/lib/ui/app/Features/Gamification/index.js

@@ -0,0 +1,67 @@
+import { jsxs as m, Fragment as p, jsx as t } from "react/jsx-runtime";
+import { useStore as i } from "@nanostores/react";
+import { Tabs as e } from "./Tabs.js";
+import { Question as s } from "./Question.js";
+import "react";
+import "../../../gamification/navigation/index.js";
+import "../../../gamification/navigation/styles.js";
+import "@linaria/react";
+import "./UserSummary.js";
+import "../../../gamification/user-statistics/index.js";
+import "../../../../utils/common.js";
+import "../../../gamification/user-statistics/components/statistics/index.js";
+import "../../../gamification/user-statistics/components/statistics/styles.js";
+import "../../../gamification/user-statistics/components/rank/index.js";
+import "../../../gamification/user-statistics/components/rank/styles.js";
+import "../../../gamification/user-statistics/styles.js";
+import "./QuestionsList.js";
+import "../../../gamification/question-list/index.js";
+import "../../../gamification/question/index.js";
+import "@streamlayer/sdk-web-types";
+import "../../../../icon-chevron-138a557c.js";
+import "../../../gamification/question/styles.js";
+import "../../../gamification/question-list/styles.js";
+import "./Leaderboard.js";
+import "../../../gamification/leaderboard-item-detail/index.js";
+import "../../../gamification/common-header/index.js";
+import "../../../../icon-exit-6a55bb8f.js";
+import "../../../gamification/common-header/styles.js";
+import "../../../gamification/leaderboard-item-detail/styles.js";
+import "../../../gamification/leaderboard-list/index.js";
+import "../../../gamification/leaderboard-invite-link/index.js";
+import "../../../gamification/leaderboard-invite-link/styles.js";
+import "../../../gamification/leaderboard-item/index.js";
+import "../../../gamification/leaderboard-item/styles.js";
+import "../../../gamification/leaderboard-list/styles.js";
+import "../../../gamification/vote/index.js";
+import "../../../../index-7045fbb2.js";
+import "../../../gamification/vote/components/voting-option/styles.js";
+import "../../../gamification/vote/styles.js";
+import "../../../gamification/vote/components/voting-header/index.js";
+import "../../../gamification/vote/components/voting-header/components/timer/index.js";
+import "react-countdown-circle-timer";
+import "../../../theme/constants.js";
+import "../../../gamification/vote/components/voting-header/components/timer/styles.js";
+import "../../../gamification/vote/components/voting-header/styles.js";
+import "../../../gamification/vote/components/voting-header/components/points/index.js";
+import "../../../gamification/vote/components/voting-header/components/points/styles.js";
+import "../../../../fedex-a8dcc7b2.js";
+const to = ({
+  gamification: o
+}) => {
+  const r = i(o.openedQuestion);
+  return /* @__PURE__ */ m(p, { children: [
+    r && /* @__PURE__ */ t(
+      s,
+      {
+        closeQuestion: o.closeQuestion,
+        vote: o.submitAnswer,
+        openedQuestion: r
+      }
+    ),
+    !r && /* @__PURE__ */ t(e, { gamification: o })
+  ] });
+};
+export {
+  to as GamificationOverlay
+};

package/lib/ui/app/Features/Highlights/Insight.js

@@ -0,0 +1,31 @@
+import { jsx as p } from "react/jsx-runtime";
+import { DetailedInsight as L } from "../../../gamification/detailed-insight/index.js";
+import "../../../gamification/common-header/index.js";
+import "../../../../icon-exit-6a55bb8f.js";
+import "../../../gamification/common-header/styles.js";
+import "@linaria/react";
+import "../../../gamification/detailed-insight/styles.js";
+const j = ({ openedInsight: o, closeHighlights: r, closeInsight: s }) => {
+  var t, a, b, n, e;
+  const i = ((t = o.options) == null ? void 0 : t.options.case) === "factoid" ? {
+    image: o.options.options.value.image,
+    body: o.options.options.value.body,
+    webLink: (a = o.options.options.value.webLink) == null ? void 0 : a.url,
+    webLinkLabel: (b = o.options.options.value.webLink) == null ? void 0 : b.label
+  } : {}, l = o.subject || ((n = o.notification) == null ? void 0 : n.title), m = i.body || ((e = o.notification) == null ? void 0 : e.body);
+  return /* @__PURE__ */ p(
+    L,
+    {
+      image: i.image,
+      title: l,
+      description: m,
+      webLink: i.webLink,
+      webLinkLabel: i.webLinkLabel,
+      closeInsight: s,
+      closeHighlights: r
+    }
+  );
+};
+export {
+  j as Insight
+};

package/lib/ui/app/Features/Highlights/Insights.js

@@ -0,0 +1,16 @@
+import { jsx as i } from "react/jsx-runtime";
+import { useStore as s } from "@nanostores/react";
+import { InsightList as m } from "../../../gamification/insight-list/index.js";
+import "../../../gamification/insight/index.js";
+import "@streamlayer/sdk-web-types";
+import "../../../../icon-chevron-138a557c.js";
+import "../../../gamification/insight/styles.js";
+import "@linaria/react";
+import "../../../gamification/insight-list/styles.js";
+const u = ({ highlights: r, store: o }) => {
+  const { data: t } = s(o);
+  return t ? /* @__PURE__ */ i(m, { insights: t, openInsight: r.openHighlight }) : /* @__PURE__ */ i("div", { children: "wait insights..." });
+};
+export {
+  u as Insights
+};

package/lib/ui/app/Features/Highlights/index.js

@@ -0,0 +1,33 @@
+import { jsxs as i, Fragment as m, jsx as r } from "react/jsx-runtime";
+import { useStore as e } from "@nanostores/react";
+import { Insight as p } from "../../../demo/components/Insight.js";
+import { Insights as s } from "../../../demo/components/Insights.js";
+import "../../../gamification/detailed-insight/index.js";
+import "../../../gamification/common-header/index.js";
+import "../../../../icon-exit-6a55bb8f.js";
+import "../../../gamification/common-header/styles.js";
+import "@linaria/react";
+import "../../../gamification/detailed-insight/styles.js";
+import "../../../gamification/insight-list/index.js";
+import "../../../gamification/insight/index.js";
+import "@streamlayer/sdk-web-types";
+import "../../../../icon-chevron-138a557c.js";
+import "../../../gamification/insight/styles.js";
+import "../../../gamification/insight-list/styles.js";
+const O = ({ highlights: o }) => {
+  const t = e(o.openedInsight);
+  return /* @__PURE__ */ i(m, { children: [
+    !t && o.insights && /* @__PURE__ */ r(s, { highlights: o, store: o.insights.getStore() }),
+    t && /* @__PURE__ */ r(
+      p,
+      {
+        openedInsight: t,
+        closeHighlights: o.closeFeature,
+        closeInsight: o.closeHighlight
+      }
+    )
+  ] });
+};
+export {
+  O as HighlightsOverlay
+};

package/lib/ui/app/Features/index.js

@@ -0,0 +1,64 @@
+import { jsx as t } from "react/jsx-runtime";
+import { FeatureType as o } from "@streamlayer/sdk-web-types";
+import { useMemo as p } from "react";
+import { GamificationOverlay as e } from "./Gamification/index.js";
+import { HighlightsOverlay as n } from "./Highlights/index.js";
+import { FeatureProvider as m } from "./FeatureProvider.js";
+import "@nanostores/react";
+import "./Gamification/Tabs.js";
+import "../../gamification/navigation/index.js";
+import "../../gamification/navigation/styles.js";
+import "@linaria/react";
+import "./Gamification/UserSummary.js";
+import "../../gamification/user-statistics/index.js";
+import "../../../utils/common.js";
+import "../../gamification/user-statistics/components/statistics/index.js";
+import "../../gamification/user-statistics/components/statistics/styles.js";
+import "../../gamification/user-statistics/components/rank/index.js";
+import "../../gamification/user-statistics/components/rank/styles.js";
+import "../../gamification/user-statistics/styles.js";
+import "./Gamification/QuestionsList.js";
+import "../../gamification/question-list/index.js";
+import "../../gamification/question/index.js";
+import "../../../icon-chevron-138a557c.js";
+import "../../gamification/question/styles.js";
+import "../../gamification/question-list/styles.js";
+import "./Gamification/Leaderboard.js";
+import "../../gamification/leaderboard-item-detail/index.js";
+import "../../gamification/common-header/index.js";
+import "../../../icon-exit-6a55bb8f.js";
+import "../../gamification/common-header/styles.js";
+import "../../gamification/leaderboard-item-detail/styles.js";
+import "../../gamification/leaderboard-list/index.js";
+import "../../gamification/leaderboard-invite-link/index.js";
+import "../../gamification/leaderboard-invite-link/styles.js";
+import "../../gamification/leaderboard-item/index.js";
+import "../../gamification/leaderboard-item/styles.js";
+import "../../gamification/leaderboard-list/styles.js";
+import "./Gamification/Question.js";
+import "../../gamification/vote/index.js";
+import "../../../index-7045fbb2.js";
+import "../../gamification/vote/components/voting-option/styles.js";
+import "../../gamification/vote/styles.js";
+import "../../gamification/vote/components/voting-header/index.js";
+import "../../gamification/vote/components/voting-header/components/timer/index.js";
+import "react-countdown-circle-timer";
+import "../../theme/constants.js";
+import "../../gamification/vote/components/voting-header/components/timer/styles.js";
+import "../../gamification/vote/components/voting-header/styles.js";
+import "../../gamification/vote/components/voting-header/components/points/index.js";
+import "../../gamification/vote/components/voting-header/components/points/styles.js";
+import "../../../fedex-a8dcc7b2.js";
+import "../../demo/components/Insight.js";
+import "../../gamification/detailed-insight/index.js";
+import "../../gamification/detailed-insight/styles.js";
+import "../../demo/components/Insights.js";
+import "../../gamification/insight-list/index.js";
+import "../../gamification/insight/index.js";
+import "../../gamification/insight/styles.js";
+import "../../gamification/insight-list/styles.js";
+import "@streamlayer/sdk-web-interfaces";
+const yr = ({ sdk: i, feature: r }) => p(() => r ? r.featureConfig.get().type === o.GAMES ? /* @__PURE__ */ t(m, { sdk: i, feature: r, children: /* @__PURE__ */ t(e, { gamification: r, sdk: i }) }) : r.featureConfig.get().type === o.HIGHLIGHTS ? /* @__PURE__ */ t(m, { sdk: i, feature: r, children: /* @__PURE__ */ t(n, { highlights: r, sdk: i }) }) : null : null, [i, r]);
+export {
+  yr as ActiveFeature
+};

package/lib/ui/app/Navigation/index.js

@@ -0,0 +1,31 @@
+import { jsx as c } from "react/jsx-runtime";
+import { AvailableFeatures as e } from "@streamlayer/sdk-web-features";
+import { useMemo as a } from "react";
+import { useStore as b } from "@nanostores/react";
+import { Navigation as v } from "../../navigation/index.js";
+import "../../navigation/styles.js";
+import "@linaria/react";
+const N = ({ customOverlays: t, activeButton: s, sdk: p }) => {
+  const { streamSettings: i, organizationSettings: r } = b(p.sdkStore), n = a(() => {
+    const o = (i == null ? void 0 : i.data) || (r == null ? void 0 : r.data);
+    return o != null && o.overlays ? o.overlays : [];
+  }, [r, i]), l = a(
+    () => [
+      ...n.filter(({ enableSdkButton: o }) => o).map((o) => ({
+        id: o.type,
+        onClick: () => p.openFeature(o.type),
+        disabled: !(o.type in e),
+        label: o.name,
+        icon: o.icon,
+        /** multiplied by 10 to add the ability to insert custom buttons between our buttons */
+        position: o.position * 10
+      })),
+      ...Object.values(t).map(({ button: o }) => o)
+    ].sort((o, m) => o.position - m.position),
+    [n, p, t]
+  );
+  return /* @__PURE__ */ c(v, { buttons: l, activeButton: s });
+};
+export {
+  N as SDKNavigation
+};

package/lib/ui/app/Notifications/index.js

@@ -0,0 +1,18 @@
+import { jsx as t } from "react/jsx-runtime";
+import { Notifications as i } from "../../notifications/index.js";
+import "@nanostores/react";
+import "../../notifications/notification/index.js";
+import "@streamlayer/sdk-web-notifications";
+import "react";
+import "../../notifications/notification/onboarding-inapp/index.js";
+import "../../notifications/notification/onboarding-inapp/styles.js";
+import "@linaria/react";
+import "../../notifications/notification/question-inapp/index.js";
+import "../../../icon-exit-6a55bb8f.js";
+import "../../notifications/notification/question-inapp/styles.js";
+import "../../notifications/notification/styles.js";
+import "../../notifications/styles.js";
+const u = ({ sdk: o }) => /* @__PURE__ */ t(i, { notificationsStore: o.getNotificationsStore() });
+export {
+  u as SDKNotifications
+};