@streamlayer/react 0.0.1-debug.1

package/lib/dist/cjs/package.json

@@ -0,0 +1 @@
+{"type":"commonjs"}

package/lib/dist/es/gamification-feature.js

@@ -0,0 +1,4 @@
+import { C as f } from "./masters.js";
+export {
+  f as default
+};

package/lib/dist/es/gamification-feature2.js

@@ -0,0 +1,285 @@
+import { jsx as s, jsxs as p, Fragment as y } from "react/jsx-runtime";
+import { A as C, s as r, B as b, f as M, I as D, a as L, b as T, M as E, u as m, T as P, p as R, k as F, z, c as B, l as U, d as O, S as j, m as q, e as H, n as V, g as Q } from "./masters.js";
+import { useCallback as K, useRef as W, useState as S, useEffect as f } from "react";
+import "nanostores";
+import "react-countdown-circle-timer";
+import "react-dom";
+import "react-countup";
+import "lodash.throttle";
+import _ from "react-infinite-scroller";
+const G = (e, t, a) => {
+  const n = t >= C.lg && t < C.xl ? 75 : 52;
+  e.current && window.scrollTo({
+    top: e.current.offsetTop - n,
+    ...a
+  });
+}, J = /* @__PURE__ */ r("div")({
+  name: "Container",
+  class: "c115qtkr",
+  propsAsIs: !1
+}), X = /* @__PURE__ */ r("div")({
+  name: "STabs",
+  class: "sxnslc8",
+  propsAsIs: !1
+}), Y = /* @__PURE__ */ r("button")({
+  name: "Button",
+  class: "b1umzux0",
+  propsAsIs: !1
+}), Z = /* @__PURE__ */ r("span")({
+  name: "Title",
+  class: "tspsaas",
+  propsAsIs: !1
+});
+var v = /* @__PURE__ */ ((e) => (e.HOME = "home", e.LEADERBOARD = "leaderboard", e))(v || {});
+const $ = ({ title: e, active: t, onClick: a }) => /* @__PURE__ */ s(Y, { "data-a": "intr", onClick: a, "data-selected": t, children: /* @__PURE__ */ s(Z, { "data-a": "intr", children: e }) }), ee = ({ activePage: e = "home", toggleActivePage: t }) => /* @__PURE__ */ s(J, { children: /* @__PURE__ */ p(X, { "data-position": e === "home" ? "left" : "right", children: [
+  /* @__PURE__ */ s($, { title: "Home", active: e === "home", onClick: () => t(
+    "home"
+    /* HOME */
+  ) }),
+  /* @__PURE__ */ s(
+    $,
+    {
+      title: "Friends",
+      active: e === "leaderboard",
+      onClick: () => t(
+        "leaderboard"
+        /* LEADERBOARD */
+      )
+    }
+  )
+] }) }), se = /* @__PURE__ */ r("div")({
+  name: "Container",
+  class: "c1ux29ft",
+  propsAsIs: !1
+}), ae = () => b, te = /* @__PURE__ */ r(ae())({
+  name: "FriendsIcon",
+  class: "f10ncfg2",
+  propsAsIs: !0
+}), re = /* @__PURE__ */ r("div")({
+  name: "Content",
+  class: "c1yc07bd",
+  propsAsIs: !1
+}), ne = /* @__PURE__ */ r("div")({
+  name: "Title",
+  class: "tj6cq7w",
+  propsAsIs: !1
+}), oe = /* @__PURE__ */ r("div")({
+  name: "Description",
+  class: "d1ag78xo",
+  propsAsIs: !1
+}), ie = () => b, ce = /* @__PURE__ */ r(ie())({
+  name: "ArrowInviteIcon",
+  class: "awohrz6",
+  propsAsIs: !0
+}), le = ({ title: e, description: t, onClick: a, className: n }) => {
+  const [o] = M({
+    type: "invitation",
+    action: "sent",
+    payload: {
+      from: D.TITLE_CARD
+    }
+  });
+  return /* @__PURE__ */ p(se, { "data-a": "intr", onClick: o(a), className: n, children: [
+    /* @__PURE__ */ s(te, { name: "icon-friends" }),
+    /* @__PURE__ */ p(re, { children: [
+      /* @__PURE__ */ s(ne, { children: e }),
+      /* @__PURE__ */ s(oe, { children: t })
+    ] }),
+    /* @__PURE__ */ s(ce, { name: "icon-copy" })
+  ] });
+}, de = /* @__PURE__ */ r("div")({
+  name: "Container",
+  class: "culdu4a",
+  propsAsIs: !1
+}), pe = /* @__PURE__ */ r("div")({
+  name: "Position",
+  class: "pwf8e69",
+  propsAsIs: !1
+}), me = /* @__PURE__ */ r("img")({
+  name: "Avatar",
+  class: "atf4yh4",
+  propsAsIs: !1
+}), ue = /* @__PURE__ */ r("div")({
+  name: "AvatarPlaceholder",
+  class: "a1dg29ja",
+  propsAsIs: !1
+}), he = /* @__PURE__ */ r("div")({
+  name: "Content",
+  class: "c10a68rc",
+  propsAsIs: !1
+}), ve = /* @__PURE__ */ r("div")({
+  name: "NameContainer",
+  class: "nc4kck5",
+  propsAsIs: !1
+}), Ie = /* @__PURE__ */ r("span")({
+  name: "Name",
+  class: "njsrqgr",
+  propsAsIs: !1
+}), ge = () => b, fe = /* @__PURE__ */ r(ge())({
+  name: "CurrentUserBadge",
+  class: "c17uc4zr",
+  propsAsIs: !0
+}), be = ({
+  friendsRank: e,
+  avatar: t,
+  name: a,
+  userId: n,
+  points: o,
+  isCurrentUser: i,
+  style: d
+}) => /* @__PURE__ */ p(de, { "data-name": n, style: d, children: [
+  /* @__PURE__ */ s(pe, { children: e || 0 }),
+  /* @__PURE__ */ p(he, { children: [
+    t ? /* @__PURE__ */ s(me, { alt: "leaderboard-item-avatar", src: t }) : /* @__PURE__ */ s(ue, { children: L(a || "") }),
+    /* @__PURE__ */ p(ve, { children: [
+      /* @__PURE__ */ s(Ie, { children: a || "" }),
+      i && /* @__PURE__ */ s(fe, { name: "icon-star" })
+    ] })
+  ] }),
+  /* @__PURE__ */ s("div", { children: T(o) })
+] }), Ae = /* @__PURE__ */ r("div")({
+  name: "Container",
+  class: "c16btbfp",
+  propsAsIs: !1
+}), ke = ({
+  items: e,
+  currentUserId: t,
+  openItemDetail: a,
+  fetchMore: n,
+  scrollNode: o,
+  hasMore: i
+}) => {
+  const d = K((c) => {
+    const l = c.target.getAttribute("data-name");
+    l && a(l);
+  }, [a]);
+  return /* @__PURE__ */ s(_, {
+    loadMore: n,
+    initialLoad: !1,
+    hasMore: i,
+    useWindow: !1,
+    getScrollParent: () => o.current,
+    children: /* @__PURE__ */ s(Ae, {
+      "data-a": "intr",
+      onClick: d,
+      children: e.map((c) => /* @__PURE__ */ s(be, {
+        ...c,
+        isCurrentUser: !!t && t === c.userId
+      }, c.userId))
+    })
+  });
+}, Ce = /* @__PURE__ */ r("div")({
+  name: "InviteFriendsContainer",
+  class: "i1c9dygq",
+  propsAsIs: !1
+}), $e = ({
+  deepLink: e
+}) => /* @__PURE__ */ s(Ce, {
+  children: /* @__PURE__ */ s(E, {
+    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__ */ r("div")({
+  name: "InviteLinkContainer",
+  class: "i1odbhm4",
+  propsAsIs: !1
+}), Se = ({
+  gamification: e,
+  scrollNode: t,
+  scrollStore: a
+}) => {
+  const n = W(null), {
+    data: o,
+    hasMore: i,
+    loading: d,
+    key: c
+  } = m(e.leaderboardList.$store), {
+    data: l
+  } = m(e.deepLink.$store), [u, I] = P(n);
+  return !o.length && !d ? /* @__PURE__ */ s($e, {
+    deepLink: l
+  }) : /* @__PURE__ */ p(y, {
+    children: [/* @__PURE__ */ s(ke, {
+      items: o,
+      scrollNode: t,
+      scrollStore: a,
+      fetchMore: e.leaderboardList.fetchMore,
+      hasMore: i,
+      openItemDetail: e.openUser,
+      currentUserId: e.currentUserId.get()
+    }, c), l && /* @__PURE__ */ s(ye, {
+      ref: n,
+      children: /* @__PURE__ */ s(le, {
+        "data-a": "intr",
+        onClick: () => u(l),
+        title: "Invite Friends",
+        description: "Challenge them now!"
+      })
+    }), I]
+  });
+}, Ne = ({ store: e, openQuestion: t }) => {
+  const { sdk: a } = R(), n = m(e);
+  return /* @__PURE__ */ s(F, { openQuestion: t, questions: n.data, controlVideo: a == null ? void 0 : a.controlVideoPlayer });
+}, we = ({ userSummary: e }) => {
+  var t;
+  const [a, n] = S(void 0);
+  return f(() => {
+    const o = e.$store.subscribe((i) => {
+      i && n(i);
+    });
+    return () => {
+      o();
+    };
+  }, [e]), /* @__PURE__ */ s(z, { loading: !(a != null && a.summary), ...a == null ? void 0 : a.summary, successRate: (t = a == null ? void 0 : a.percentage) == null ? void 0 : t.correct });
+}, xe = ({ gamification: e, className: t, scrollStore: a, scrollNode: n, appNode: o, style: i, responsiveStore: d }) => {
+  const { tabsShown: c } = m(a, { keys: ["tabsShown"] }), l = m(e.friendsTabEnabled), [u, I] = S(v.HOME), [, N] = B(), { sdkInDesktopView: A, screen: w } = m(d, { keys: ["sdkInDesktopView"] }), x = (h) => {
+    N(() => {
+      var k;
+      I(h), A === !1 && (((k = o.current) == null ? void 0 : k.getBoundingClientRect().y) || 0) < 0 && G(o, w.size, { behavior: "instant" });
+    });
+  };
+  f(() => a.subscribe((h) => {
+    if (h.scrollPosition === 0) {
+      a.setKey("tabsShown", !0);
+      return;
+    }
+    d.get().sdkInDesktopView ? a.setKey("tabsShown", h.scrollDirection === "backward") : a.setKey("tabsShown", h.scrollDirection === "forward");
+  }), [a, d]), f(() => {
+    l || I(v.HOME);
+  }, [l]);
+  let g = "0px";
+  return A ? g = c ? "0px" : "calc(0px - var(--header-height))" : g = c ? "var(--header-height)" : "0px", /* @__PURE__ */ p(U, { className: O(t, "SL-Tabs", "sl-hide-on-modal"), style: i, children: [
+    l && /* @__PURE__ */ s(
+      j,
+      {
+        style: {
+          top: g
+        },
+        children: /* @__PURE__ */ s(ee, { activePage: u, toggleActivePage: x })
+      }
+    ),
+    u === v.HOME && /* @__PURE__ */ p(y, { children: [
+      /* @__PURE__ */ s(q, { children: /* @__PURE__ */ s(H, { children: /* @__PURE__ */ s(we, { userSummary: e.userSummary }) }) }),
+      /* @__PURE__ */ s(V, { style: { flex: 1 }, children: /* @__PURE__ */ s(Ne, { openQuestion: e.openQuestion, store: e.feedList.getStore() }) })
+    ] }),
+    u === v.LEADERBOARD && /* @__PURE__ */ s(Q, { children: /* @__PURE__ */ s(Se, { scrollStore: a, scrollNode: n, gamification: e }) })
+  ] });
+}, Be = ({
+  gamification: e,
+  scrollStore: t,
+  className: a,
+  appNode: n,
+  scrollNode: o,
+  responsiveStore: i
+}) => /* @__PURE__ */ s(xe, {
+  appNode: n,
+  scrollStore: t,
+  scrollNode: o,
+  className: a,
+  gamification: e,
+  responsiveStore: i
+});
+export {
+  Be as default
+};

package/lib/dist/es/index.js

@@ -0,0 +1,15 @@
+import "react/jsx-runtime";
+import "lodash.throttle";
+import "react";
+import "nanostores";
+import { h as S, j as p, o as L, r as y, i as n, q as P } from "./masters.js";
+import "react-dom";
+import "react-countup";
+export {
+  S as BetPackStandalone,
+  p as MastersStreamLayerProvider,
+  L as MastersStreamLayerSDKReact,
+  y as StreamLayerLogin,
+  n as StreamLayerSDKPoints,
+  P as useStreamLayer
+};