@streamlayer/web-os 0.4.2 → 0.4.4

package/lib/es/gamification-feature.js

@@ -1,4 +1,608 @@
-import { F as f } from "./index2.js";
+import { jsxs as i, jsx as s, Fragment as k } from "react/jsx-runtime";
+import { A as T, s as n, i as $, I as V, a as D, B as v, f as U, b as j, u as h, r as F, S as z, O, c as Q, R as W, D as Z, w as K, p as _, d as G, l as J, e as X, g as Y, m as ss, h as es, n as ns, C as as } from "./index2.js";
+import "@noriginmedia/norigin-spatial-navigation";
+import { useRef as y, useState as w, useCallback as P, useEffect as g } from "react";
+import "react-countdown-circle-timer";
+import { createPortal as ts } from "react-dom";
+import "react-countup";
+import "nanostores";
+import "lodash.throttle";
+import rs from "react-infinite-scroller";
+const is = (e, a, t) => {
+  const o = a >= T.lg && a < T.xl ? 75 : 52;
+  e.current && window.scrollTo({
+    top: e.current.offsetTop - o,
+    ...t
+  });
+}, os = /* @__PURE__ */ n("div")({
+  name: "Container",
+  class: "c1zy8a",
+  propsAsIs: !1
+}), cs = /* @__PURE__ */ n("div")({
+  name: "Title",
+  class: "t1vih9p5",
+  propsAsIs: !1
+}), ls = /* @__PURE__ */ n("div")({
+  name: "Indicator",
+  class: "i1fbnvpb",
+  propsAsIs: !1
+}), x = ({ indicator: e, title: a }) => /* @__PURE__ */ i(os, { children: [
+  /* @__PURE__ */ s(cs, { children: a }),
+  /* @__PURE__ */ s(ls, { children: e })
+] }), ds = /* @__PURE__ */ n("div")({
+  name: "Container",
+  class: "ctmhwyc",
+  propsAsIs: !1
+}), ps = /* @__PURE__ */ n("div")({
+  name: "Indicator",
+  class: "i1jri200",
+  propsAsIs: !1
+}), ms = /* @__PURE__ */ n("div")({
+  name: "Title",
+  class: "t8s05oq",
+  propsAsIs: !1
+}), A = ({ indicator: e, title: a }) => /* @__PURE__ */ i(ds, { children: [
+  /* @__PURE__ */ s(ps, { children: e }),
+  /* @__PURE__ */ s(ms, { children: a })
+] }), us = /* @__PURE__ */ n("div")({
+  name: "Container",
+  class: "c1yrpn9o",
+  propsAsIs: !1
+}), hs = /* @__PURE__ */ n("div")({
+  name: "TopInfo",
+  class: "t17fwahh",
+  propsAsIs: !1
+}), vs = /* @__PURE__ */ n("div")({
+  name: "BottomInfo",
+  class: "by6w7e9",
+  propsAsIs: !1
+}), Is = /* @__PURE__ */ n("div")({
+  name: "User",
+  class: "u1g7arbm",
+  propsAsIs: !1
+}), Cs = /* @__PURE__ */ n("img")({
+  name: "Avatar",
+  class: "a1ldeata",
+  propsAsIs: !1
+}), $s = /* @__PURE__ */ n("div")({
+  name: "UserInfo",
+  class: "u10d4koz",
+  propsAsIs: !1
+}), As = /* @__PURE__ */ n("div")({
+  name: "UserName",
+  class: "u1q6roj0",
+  propsAsIs: !1
+}), gs = /* @__PURE__ */ n("div")({
+  name: "UserRating",
+  class: "ui0m425",
+  propsAsIs: !1
+}), bs = /* @__PURE__ */ n("img")({
+  name: "TrophyIcon",
+  class: "t1el3mrn",
+  propsAsIs: !1
+}), fs = /* @__PURE__ */ n("div")({
+  name: "RtsContainer",
+  class: "r2vgnxv",
+  propsAsIs: !1
+}), ks = /* @__PURE__ */ n("div")({
+  name: "RtsDivider",
+  class: "roqn06j",
+  propsAsIs: !1
+}), ys = /* @__PURE__ */ n("div")({
+  name: "Rts",
+  class: "r15adx7c",
+  propsAsIs: !1
+}), q = /* @__PURE__ */ n("div")({
+  name: "RtsIndicator",
+  class: "rv59lta",
+  propsAsIs: !1
+}), N = /* @__PURE__ */ n("div")({
+  name: "RtsLabel",
+  class: "r55lotb",
+  propsAsIs: !1
+}), ws = /* @__PURE__ */ n("div")({
+  name: "Divider",
+  class: "d1knfgqt",
+  propsAsIs: !1
+}), Ss = /* @__PURE__ */ n("div")({
+  name: "Ranks",
+  class: "r1mqo824",
+  propsAsIs: !1
+}), Ls = /* @__PURE__ */ n("div")({
+  name: "Statistics",
+  class: "sxareh6",
+  propsAsIs: !1
+}), Ts = /* @__PURE__ */ n("div")({
+  name: "AvatarPlaceholder",
+  class: "amcu48h",
+  propsAsIs: !1
+}), xs = /* @__PURE__ */ n("button")({
+  name: "UserAccountBtn",
+  class: "u32nfkp",
+  propsAsIs: !1
+}), qs = "data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Trophy'%3e%3cpath%20id='Combined%20Shape'%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M3.69197%204.66662C3.69197%205.99705%203.92914%207.17787%204.4035%208.20912C3.49966%208.02451%202.74487%207.66486%202.1391%207.13014C1.53333%206.59542%201.23046%206.0798%201.23046%205.58328V4.66662H3.69197ZM14.7686%204.66662V5.58328C14.7686%206.0798%2014.4658%206.59542%2013.86%207.13014C13.2542%207.66486%2012.4994%208.02451%2011.5956%208.20912C12.0699%207.17787%2012.3071%205.99705%2012.3071%204.66662H14.7686ZM15.9998%205.58329V4.36108C15.9998%204.10645%2015.9101%203.89002%2015.7306%203.71178C15.5511%203.53354%2015.3332%203.44442%2015.0768%203.44442H12.3076V2.52776C12.3076%202.10763%2012.1569%201.74797%2011.8556%201.44878C11.5544%201.14959%2011.1922%201%2010.7691%201H5.23072C4.80764%201%204.44547%201.14959%204.14419%201.44878C3.84291%201.74797%203.69227%202.10763%203.69227%202.52776V3.44442H0.923068C0.666659%203.44442%200.448714%203.53354%200.269228%203.71178C0.0897418%203.89002%200%204.10645%200%204.36108V5.58329C0%206.03525%200.13301%206.49039%200.399034%206.94872C0.665059%207.40705%201.02403%207.82082%201.47595%208.19003C1.92787%208.55924%202.48234%208.86957%203.13939%209.12101C3.79644%209.37246%204.48713%209.51409%205.21149%209.54592C5.48071%209.88967%205.7852%2010.192%206.12494%2010.453C6.36853%2010.6695%206.53679%2010.9002%206.62974%2011.1453C6.72269%2011.3904%206.76916%2011.6752%206.76916%2011.9999C6.76916%2012.3436%206.67141%2012.6333%206.4759%2012.8688C6.28038%2013.1043%205.96789%2013.2221%205.53841%2013.2221C5.05764%2013.2221%204.62976%2013.3669%204.25476%2013.6566C3.87977%2013.9462%203.69227%2014.3106%203.69227%2014.7499V15.361C3.69227%2015.4501%203.72112%2015.5233%203.77881%2015.5806C3.8365%2015.6379%203.91022%2015.6665%203.99996%2015.6665H11.9999C12.0896%2015.6665%2012.1633%2015.6379%2012.221%2015.5806C12.2787%2015.5233%2012.3076%2015.4501%2012.3076%2015.361V14.7499C12.3076%2014.3106%2012.1201%2013.9462%2011.7451%2013.6566C11.3701%2013.3669%2010.9422%2013.2221%2010.4614%2013.2221C10.0319%2013.2221%209.71945%2013.1043%209.52394%2012.8688C9.32843%2012.6333%209.23068%2012.3436%209.23068%2011.9999C9.23068%2011.6752%209.27715%2011.3904%209.3701%2011.1453C9.46305%2010.9002%209.63131%2010.6695%209.8749%2010.453C10.2146%2010.192%2010.5191%209.88967%2010.7884%209.54592C11.5127%209.51409%2012.2034%209.37246%2012.8604%209.12101C13.5175%208.86957%2014.072%208.55924%2014.5239%208.19003C14.9758%207.82082%2015.3348%207.40705%2015.6008%206.94872C15.8668%206.49039%2015.9998%206.03525%2015.9998%205.58329ZM6.76047%207.1798L8.05109%206.49997L9.3417%207.1798L9.09521%205.73989L10.1393%204.72015L8.69639%204.51007L8.05109%203.2L7.40578%204.51007L5.96283%204.72015L7.00696%205.73989L6.76047%207.1798Z'%20fill='%23F2C94C'/%3e%3c/g%3e%3c/svg%3e", Ns = ({
+  loading: e,
+  hideFriendsRank: a,
+  avatar: t,
+  name: o,
+  points: r,
+  friendsRank: c,
+  rank: d,
+  streak: p,
+  correct: l,
+  incorrect: m,
+  inTop: u,
+  successRate: b
+}) => /* @__PURE__ */ i(us, { "data-loading": e, children: [
+  /* @__PURE__ */ s(hs, { children: /* @__PURE__ */ s($, { loading: e, children: /* @__PURE__ */ i(Is, { children: [
+    /* @__PURE__ */ i(xs, { children: [
+      t && /* @__PURE__ */ s(Cs, { alt: "avatar", src: t }),
+      !t && /* @__PURE__ */ s(Ts, { children: V(o || "") })
+    ] }),
+    /* @__PURE__ */ i($s, { children: [
+      /* @__PURE__ */ s(As, { children: o }),
+      /* @__PURE__ */ i(gs, { children: [
+        /* @__PURE__ */ i(fs, { children: [
+          /* @__PURE__ */ i(ys, { children: [
+            /* @__PURE__ */ s(bs, { alt: "rank-icon", src: qs }),
+            /* @__PURE__ */ i(q, { children: [
+              D(r),
+              /* @__PURE__ */ s(N, { children: "PTS" })
+            ] })
+          ] }),
+          a && /* @__PURE__ */ i(q, { children: [
+            /* @__PURE__ */ s(ks, {}),
+            d || 0,
+            /* @__PURE__ */ s(N, { children: "global rank" })
+          ] })
+        ] }),
+        !a && /* @__PURE__ */ i(k, { children: [
+          /* @__PURE__ */ s(ws, {}),
+          /* @__PURE__ */ i("div", { children: [
+            "TOP ",
+            u || 0,
+            "%"
+          ] })
+        ] })
+      ] })
+    ] })
+  ] }) }) }),
+  /* @__PURE__ */ i(vs, { children: [
+    !a && /* @__PURE__ */ i(Ss, { children: [
+      /* @__PURE__ */ s($, { loading: e, style: { width: "100%" }, children: /* @__PURE__ */ s(x, { indicator: c || 0, title: "Friends rank" }) }),
+      /* @__PURE__ */ s($, { loading: e, style: { width: "100%" }, children: /* @__PURE__ */ s(x, { indicator: d || 0, title: "Global rank" }) })
+    ] }),
+    /* @__PURE__ */ s($, { loading: e, children: /* @__PURE__ */ i(Ls, { children: [
+      /* @__PURE__ */ s(A, { indicator: p || 0, title: "Win streak" }),
+      /* @__PURE__ */ s(A, { indicator: l || 0, title: "Correct" }),
+      /* @__PURE__ */ s(A, { indicator: m || 0, title: "Incorrect" }),
+      /* @__PURE__ */ s(A, { indicator: `${b || 0}%`, title: "Succ. rate" })
+    ] }) })
+  ] })
+] }), Rs = /* @__PURE__ */ n("div")({
+  name: "Container",
+  class: "c115qtkr",
+  propsAsIs: !1
+}), Ms = /* @__PURE__ */ n("div")({
+  name: "STabs",
+  class: "sxnslc8",
+  propsAsIs: !1
+}), Vs = /* @__PURE__ */ n("button")({
+  name: "Button",
+  class: "b1umzux0",
+  propsAsIs: !1
+}), Ds = /* @__PURE__ */ n("span")({
+  name: "Title",
+  class: "tspsaas",
+  propsAsIs: !1
+});
+var C = /* @__PURE__ */ ((e) => (e.HOME = "home", e.LEADERBOARD = "leaderboard", e))(C || {});
+const R = ({ title: e, active: a, onClick: t }) => /* @__PURE__ */ s(Vs, { "data-a": "intr", onClick: t, "data-selected": a, children: /* @__PURE__ */ s(Ds, { "data-a": "intr", children: e }) }), Us = ({ activePage: e = "home", toggleActivePage: a }) => /* @__PURE__ */ s(Rs, { children: /* @__PURE__ */ i(Ms, { "data-position": e === "home" ? "left" : "right", children: [
+  /* @__PURE__ */ s(R, { title: "Home", active: e === "home", onClick: () => a(
+    "home"
+    /* HOME */
+  ) }),
+  /* @__PURE__ */ s(
+    R,
+    {
+      title: "Friends",
+      active: e === "leaderboard",
+      onClick: () => a(
+        "leaderboard"
+        /* LEADERBOARD */
+      )
+    }
+  )
+] }) }), js = /* @__PURE__ */ n("button")({
+  name: "Container",
+  class: "cpjnajb",
+  propsAsIs: !1
+}), Fs = /* @__PURE__ */ n("div")({
+  name: "Content",
+  class: "c4m6kaz",
+  propsAsIs: !1
+}), Ps = /* @__PURE__ */ n("span")({
+  name: "Title",
+  class: "t1h8t9cc",
+  propsAsIs: !1
+}), Bs = () => /* @__PURE__ */ s(js, { children: /* @__PURE__ */ i(Fs, { children: [
+  /* @__PURE__ */ s(v, { name: "iconCopySuccess" }),
+  /* @__PURE__ */ s(Ps, { children: "Link Copied to Clipboard" })
+] }) }), B = (e) => {
+  const a = y(), [t, o] = w(null), r = P(
+    async (c) => {
+      var d;
+      if (c && (d = navigator == null ? void 0 : navigator.clipboard) != null && d.writeText) {
+        a.current && (clearTimeout(a.current), o(null));
+        try {
+          await navigator.clipboard.writeText(c), e.current && (o(ts(/* @__PURE__ */ s(Bs, {}), e.current)), a.current = setTimeout(() => {
+            o(null);
+          }, 1e3));
+        } catch (p) {
+          console.error("Unable to copy to clipboard", p);
+        }
+      }
+    },
+    [e]
+  );
+  return g(() => () => {
+    clearTimeout(a.current);
+  }, []), [r, t];
+}, Es = /* @__PURE__ */ n("div")({
+  name: "Container",
+  class: "c1ux29ft",
+  propsAsIs: !1
+}), Hs = () => v, zs = /* @__PURE__ */ n(Hs())({
+  name: "FriendsIcon",
+  class: "f10ncfg2",
+  propsAsIs: !0
+}), Os = /* @__PURE__ */ n("div")({
+  name: "Content",
+  class: "c1yc07bd",
+  propsAsIs: !1
+}), Qs = /* @__PURE__ */ n("div")({
+  name: "Title",
+  class: "tj6cq7w",
+  propsAsIs: !1
+}), Ws = /* @__PURE__ */ n("div")({
+  name: "Description",
+  class: "d1ag78xo",
+  propsAsIs: !1
+}), Zs = () => v, Ks = /* @__PURE__ */ n(Zs())({
+  name: "ArrowInviteIcon",
+  class: "awohrz6",
+  propsAsIs: !0
+}), _s = ({ title: e, description: a, onClick: t, className: o }) => {
+  const [r] = U({
+    type: "invitation",
+    action: "sent",
+    payload: {
+      from: j.TITLE_CARD
+    }
+  });
+  return /* @__PURE__ */ i(Es, { "data-a": "intr", onClick: r(t), className: o, children: [
+    /* @__PURE__ */ s(zs, { name: "icon-friends" }),
+    /* @__PURE__ */ i(Os, { children: [
+      /* @__PURE__ */ s(Qs, { children: e }),
+      /* @__PURE__ */ s(Ws, { children: a })
+    ] }),
+    /* @__PURE__ */ s(Ks, { name: "icon-copy" })
+  ] });
+}, Gs = /* @__PURE__ */ n("div")({
+  name: "Container",
+  class: "culdu4a",
+  propsAsIs: !1
+}), Js = /* @__PURE__ */ n("div")({
+  name: "Position",
+  class: "pwf8e69",
+  propsAsIs: !1
+}), Xs = /* @__PURE__ */ n("img")({
+  name: "Avatar",
+  class: "atf4yh4",
+  propsAsIs: !1
+}), Ys = /* @__PURE__ */ n("div")({
+  name: "AvatarPlaceholder",
+  class: "a1dg29ja",
+  propsAsIs: !1
+}), se = /* @__PURE__ */ n("div")({
+  name: "Content",
+  class: "c10a68rc",
+  propsAsIs: !1
+}), ee = /* @__PURE__ */ n("div")({
+  name: "NameContainer",
+  class: "nc4kck5",
+  propsAsIs: !1
+}), ne = /* @__PURE__ */ n("span")({
+  name: "Name",
+  class: "njsrqgr",
+  propsAsIs: !1
+}), ae = () => v, te = /* @__PURE__ */ n(ae())({
+  name: "CurrentUserBadge",
+  class: "c17uc4zr",
+  propsAsIs: !0
+}), re = ({
+  friendsRank: e,
+  avatar: a,
+  name: t,
+  userId: o,
+  points: r,
+  isCurrentUser: c,
+  style: d
+}) => /* @__PURE__ */ i(Gs, { "data-name": o, style: d, children: [
+  /* @__PURE__ */ s(Js, { children: e || 0 }),
+  /* @__PURE__ */ i(se, { children: [
+    a ? /* @__PURE__ */ s(Xs, { alt: "leaderboard-item-avatar", src: a }) : /* @__PURE__ */ s(Ys, { children: V(t || "") }),
+    /* @__PURE__ */ i(ee, { children: [
+      /* @__PURE__ */ s(ne, { children: t || "" }),
+      c && /* @__PURE__ */ s(te, { name: "icon-star" })
+    ] })
+  ] }),
+  /* @__PURE__ */ s("div", { children: D(r) })
+] }), ie = /* @__PURE__ */ n("div")({
+  name: "Container",
+  class: "c16btbfp",
+  propsAsIs: !1
+}), oe = ({
+  items: e,
+  currentUserId: a,
+  openItemDetail: t,
+  fetchMore: o,
+  scrollNode: r,
+  hasMore: c
+}) => {
+  const d = P((p) => {
+    const l = p.target.getAttribute("data-name");
+    l && t(l);
+  }, [t]);
+  return /* @__PURE__ */ s(rs, {
+    loadMore: o,
+    initialLoad: !1,
+    hasMore: c,
+    useWindow: !1,
+    getScrollParent: () => r.current,
+    children: /* @__PURE__ */ s(ie, {
+      "data-a": "intr",
+      onClick: d,
+      children: e.map((p) => /* @__PURE__ */ s(re, {
+        ...p,
+        isCurrentUser: !!a && a === p.userId
+      }, p.userId))
+    })
+  });
+}, ce = /* @__PURE__ */ n("div")({
+  name: "Container",
+  class: "c1itm4k7",
+  propsAsIs: !1
+}), le = /* @__PURE__ */ n("div")({
+  name: "IconContainer",
+  class: "i1w4fsni",
+  propsAsIs: !1
+}), de = () => v, pe = /* @__PURE__ */ n(de())({
+  name: "InviteGameIcon",
+  class: "i19m85r1",
+  propsAsIs: !0
+}), me = /* @__PURE__ */ n("div")({
+  name: "Content",
+  class: "c1mbu204",
+  propsAsIs: !1
+}), ue = /* @__PURE__ */ n("div")({
+  name: "Heading",
+  class: "h1amdqtv",
+  propsAsIs: !1
+}), he = /* @__PURE__ */ n("div")({
+  name: "Subtext",
+  class: "s1lhlj9j",
+  propsAsIs: !1
+}), ve = /* @__PURE__ */ n("div")({
+  name: "LinkContainer",
+  class: "l1wot35e",
+  propsAsIs: !1
+}), Ie = /* @__PURE__ */ n("div")({
+  name: "LinkInfo",
+  class: "l1jdw39q",
+  propsAsIs: !1
+}), Ce = /* @__PURE__ */ n("span")({
+  name: "LinkTitle",
+  class: "l1cr5mk",
+  propsAsIs: !1
+}), $e = /* @__PURE__ */ n("span")({
+  name: "LinkAddress",
+  class: "lvi87q4",
+  propsAsIs: !1
+}), Ae = () => v, ge = /* @__PURE__ */ n(Ae())({
+  name: "LinkIcon",
+  class: "l1pqlvw3",
+  propsAsIs: !0
+}), be = ({
+  inviteLink: e,
+  inviteCardTitle: a,
+  inviteCardSubtext: t,
+  primaryColor: o,
+  className: r
+}) => {
+  const c = y(null), [d, p] = B(c), [l] = U({
+    type: "invitation",
+    action: "sent",
+    payload: {
+      from: j.MENU
+    }
+  });
+  return /* @__PURE__ */ i(ce, { className: r, children: [
+    /* @__PURE__ */ s(le, { style: { backgroundColor: o }, children: /* @__PURE__ */ s(pe, { name: "invite-game-icon" }) }),
+    /* @__PURE__ */ i(me, { children: [
+      /* @__PURE__ */ s(ue, { children: a || "" }),
+      /* @__PURE__ */ s(he, { children: t || "" })
+    ] }),
+    e && /* @__PURE__ */ i(ve, { ref: c, "data-a": "intr", onClick: l(() => d(e)), children: [
+      /* @__PURE__ */ i(Ie, { children: [
+        /* @__PURE__ */ s(Ce, { children: "Invite link" }),
+        /* @__PURE__ */ s($e, { children: e })
+      ] }),
+      /* @__PURE__ */ s(ge, { name: "icon-copy" })
+    ] }),
+    p
+  ] });
+}, fe = /* @__PURE__ */ n("div")({
+  name: "InviteFriendsContainer",
+  class: "i1c9dygq",
+  propsAsIs: !1
+}), ke = ({
+  deepLink: e
+}) => /* @__PURE__ */ s(fe, {
+  children: /* @__PURE__ */ s(be, {
+    inviteLink: e,
+    inviteCardTitle: "It’s More Fun With Friends",
+    inviteCardSubtext: "Invite and compete against your friends for the top spot on the leaderboard."
+  })
+}), ye = /* @__PURE__ */ n("div")({
+  name: "InviteLinkContainer",
+  class: "i1odbhm4",
+  propsAsIs: !1
+}), we = ({
+  gamification: e,
+  scrollNode: a,
+  scrollStore: t
+}) => {
+  const o = y(null), {
+    data: r,
+    hasMore: c,
+    loading: d,
+    key: p
+  } = h(e.leaderboardList.$store), {
+    data: l
+  } = h(e.deepLink.$store), [m, u] = B(o);
+  return !r.length && !d ? /* @__PURE__ */ s(ke, {
+    deepLink: l
+  }) : /* @__PURE__ */ i(k, {
+    children: [/* @__PURE__ */ s(oe, {
+      items: r,
+      scrollNode: a,
+      scrollStore: t,
+      fetchMore: e.leaderboardList.fetchMore,
+      hasMore: c,
+      openItemDetail: e.openUser,
+      currentUserId: e.currentUserId.get()
+    }, p), l && /* @__PURE__ */ s(ye, {
+      ref: o,
+      children: /* @__PURE__ */ s(_s, {
+        "data-a": "intr",
+        onClick: () => m(l),
+        title: "Invite Friends",
+        description: "Challenge them now!"
+      })
+    }), u]
+  });
+}, Se = () => F, Le = /* @__PURE__ */ n(Se())({
+  name: "Container",
+  class: "cll3md7",
+  propsAsIs: !0
+}), Te = () => z, xe = /* @__PURE__ */ n(Te())({
+  name: "ActionBtn",
+  class: "a10g1iik",
+  propsAsIs: !0
+}), qe = ({ questionId: e, ...a }) => /* @__PURE__ */ i(Le, { "data-a": "intr", "data-name": e, children: [
+  /* @__PURE__ */ s(O, { questionId: e, ...a }),
+  /* @__PURE__ */ s(xe, { "data-a": "intr", "data-name": e, children: "View Insight" })
+] }), Ne = () => F, Re = /* @__PURE__ */ n(Ne())({
+  name: "Container",
+  class: "cl56x6b",
+  propsAsIs: !0
+}), Me = /* @__PURE__ */ n("button")({
+  name: "ActionButton",
+  class: "a11pzf92",
+  propsAsIs: !1
+}), Ve = /* @__PURE__ */ n("blockquote")({
+  name: "Quote",
+  class: "q1hbaleq",
+  propsAsIs: !1
+}), De = ({ ...e }) => /* @__PURE__ */ i(Re, { "data-a": "intr", "data-name": e.tweetId, children: [
+  e.title && /* @__PURE__ */ s(Ve, { children: e.title }),
+  /* @__PURE__ */ s(Q, { ...e }),
+  /* @__PURE__ */ s(Me, { "data-a": "intr", "data-name": e.tweetId, children: "View Insight" })
+] }), M = /* @__PURE__ */ n("div")({
+  name: "QuestionsContainer",
+  class: "qvghv3l",
+  propsAsIs: !1
+}), Ue = ({ questions: e, openQuestion: a, controlVideo: t }) => e ? /* @__PURE__ */ s(M, { "data-a": "intr", onClick: (r) => {
+  const c = r.target.getAttribute("data-name");
+  c && (K(), a(c, { openedFrom: "list" }));
+}, children: e == null ? void 0 : e.map((r) => {
+  var c, d, p;
+  if (r.type === "question" && ((c = r.attributes) == null ? void 0 : c.attributes.case) === "question") {
+    const l = r.attributes.attributes.value;
+    return /* @__PURE__ */ s(W, { ...l }, l.questionId);
+  }
+  if (r.type === "insight" && ((d = r.attributes) == null ? void 0 : d.attributes.case) === "insight") {
+    const l = r.attributes.attributes.value;
+    return /* @__PURE__ */ s(qe, { controlVideo: t, ...l }, l.questionId);
+  }
+  if (r.type === "tweet" && ((p = r.attributes) == null ? void 0 : p.attributes.case) === "tweet") {
+    const l = r.attributes.attributes.value, m = r.attributes.id;
+    return /* @__PURE__ */ s(De, { controlVideo: t, ...l, tweetId: m }, m);
+  }
+  return null;
+}) }) : /* @__PURE__ */ s(M, { children: Array.from({ length: 5 }).map((r, c) => /* @__PURE__ */ s(Z, {}, c)) }), je = ({ store: e, openQuestion: a }) => {
+  const { sdk: t } = _(), o = h(e);
+  return /* @__PURE__ */ s(Ue, { openQuestion: a, questions: o.data, controlVideo: t == null ? void 0 : t.controlVideoPlayer });
+}, Fe = ({ userSummary: e }) => {
+  var a;
+  const [t, o] = w(void 0);
+  return g(() => {
+    const r = e.$store.subscribe((c) => {
+      c && o(c);
+    });
+    return () => {
+      r();
+    };
+  }, [e]), /* @__PURE__ */ s(Ns, { loading: !(t != null && t.summary), ...t == null ? void 0 : t.summary, successRate: (a = t == null ? void 0 : t.percentage) == null ? void 0 : a.correct });
+}, Pe = ({ gamification: e, className: a, scrollStore: t, scrollNode: o, appNode: r, style: c, responsiveStore: d }) => {
+  const { tabsShown: p } = h(t, { keys: ["tabsShown"] }), l = h(e.friendsTabEnabled), [m, u] = w(C.HOME), [, b] = G(), { sdkInDesktopView: S, screen: E } = h(d, { keys: ["sdkInDesktopView"] }), H = (I) => {
+    b(() => {
+      var L;
+      u(I), S === !1 && (((L = r.current) == null ? void 0 : L.getBoundingClientRect().y) || 0) < 0 && is(r, E.size, { behavior: "instant" });
+    });
+  };
+  g(() => t.subscribe((I) => {
+    if (I.scrollPosition === 0) {
+      t.setKey("tabsShown", !0);
+      return;
+    }
+    d.get().sdkInDesktopView ? t.setKey("tabsShown", I.scrollDirection === "backward") : t.setKey("tabsShown", I.scrollDirection === "forward");
+  }), [t, d]), g(() => {
+    l || u(C.HOME);
+  }, [l]);
+  let f = "0px";
+  return S ? f = p ? "0px" : "calc(0px - var(--header-height))" : f = p ? "var(--header-height)" : "0px", /* @__PURE__ */ i(J, { className: X(a, "SL-Tabs", "sl-hide-on-modal"), style: c, children: [
+    l && /* @__PURE__ */ s(
+      Y,
+      {
+        style: {
+          top: f
+        },
+        children: /* @__PURE__ */ s(Us, { activePage: m, toggleActivePage: H })
+      }
+    ),
+    m === C.HOME && /* @__PURE__ */ i(k, { children: [
+      /* @__PURE__ */ s(ss, { children: /* @__PURE__ */ s(es, { children: /* @__PURE__ */ s(Fe, { userSummary: e.userSummary }) }) }),
+      /* @__PURE__ */ s(ns, { style: { flex: 1 }, children: /* @__PURE__ */ s(je, { openQuestion: e.openQuestion, store: e.feedList.getStore() }) })
+    ] }),
+    m === C.LEADERBOARD && /* @__PURE__ */ s(as, { children: /* @__PURE__ */ s(we, { scrollStore: t, scrollNode: o, gamification: e }) })
+  ] });
+}, Ge = ({
+  gamification: e,
+  scrollStore: a,
+  className: t,
+  appNode: o,
+  scrollNode: r,
+  responsiveStore: c
+}) => /* @__PURE__ */ s(Pe, {
+  appNode: o,
+  scrollStore: a,
+  scrollNode: r,
+  className: t,
+  gamification: e,
+  responsiveStore: c
+});
 export {
-  f as default
+  Ge as default
 };

package/lib/es/index.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
-import { q as i, y as p, v as y, x as L, z as v, E as u } from "./index2.js";
-import "nanostores";
+import { j as i, q as p, k as y, o as L, t as v, v as u } from "./index2.js";
 import "react";
+import "nanostores";
 import "lodash.throttle";
 import "react-dom";
 import "react-countup";