@streamlayer/react-ui 1.18.1 → 1.19.1

package/lib/app/masters/BetPack/index.js

@@ -1,84 +1,90 @@
-import { jsxs as u, jsx as r } from "react/jsx-runtime";
-import { useState as p, useCallback as y, memo as H, useMemo as k, useRef as B, useEffect as A } from "react";
-import { useStore as g } from "@streamlayer/react-polyfills";
-import { FeatureType as N } from "@streamlayer/sdk-web-types";
-import { BetPackContent as b } from "./BetPackContent/index.js";
-import { EmergencyScreen as L } from "./BetPackContent/EmergencyScreen/index.js";
-import { LoaderScreen as z } from "./BetPackContent/LoaderScreen/index.js";
-import { BetPackContainer as F } from "./styles.js";
-import { defaultEventHandler as I } from "./utils.js";
-import { cx as x } from "@linaria/core";
-import { SvgIcon as P } from "../../../ui/icons/index.js";
-import { Container as O, Header as R, HeaderTitle as j, CloseButton as E, Main as T, Footer as G, SlideSwitchButton as v, IconArrowPrev as M, buttonAvailable as w, IconArrowNext as U } from "./BetPackOverlay/styles.js";
-const re = ({ sdk: m, onEvent: i, close: f, isMobile: o }) => {
-  const [t, h] = p(), [e, a] = p(), c = y(
+import { jsxs as f, jsx as r } from "react/jsx-runtime";
+import { cx as p } from "@linaria/core";
+import C from "lodash.throttle";
+import { useState as g, useCallback as S, memo as H, useMemo as B, useRef as N, useEffect as A } from "react";
+import { useStore as P } from "@streamlayer/react-polyfills";
+import { FeatureType as b } from "@streamlayer/sdk-web-types";
+import { BetPackContent as L } from "./BetPackContent/index.js";
+import { EmergencyScreen as z } from "./BetPackContent/EmergencyScreen/index.js";
+import { LoaderScreen as F } from "./BetPackContent/LoaderScreen/index.js";
+import { BetPackContainer as I } from "./styles.js";
+import { defaultEventHandler as O } from "./utils.js";
+import { SvgIcon as x } from "../../../ui/icons/index.js";
+import { Container as R, Header as j, HeaderTitle as E, CloseButton as M, Main as T, Footer as G, SlideSwitchButton as v, IconArrowPrev as U, buttonAvailable as y, IconArrowNext as Y } from "./BetPackOverlay/styles.js";
+const ne = ({ sdk: l, onEvent: o, close: u, isMobile: c }) => {
+  const [t, h] = g(), [e, a] = g(), i = S(
     (n) => {
       if (n.type === "slBetPackReady") {
-        const { next: s, prev: d, current: l, canNext: S, canPrev: C } = n.payload || {};
-        h({ next: s, prev: d }), a({ current: l, canNext: S, canPrev: C });
+        const { next: s, prev: d, current: m, canNext: k, canPrev: w } = n.payload || {};
+        h({ next: s, prev: d }), a({
+          current: m,
+          canPrev: w,
+          canNext: k
+        });
       }
       if (n.type === "slBetPackChangeCard") {
-        const { current: s, canNext: d, canPrev: l } = n.payload || {};
-        a({ current: s, canNext: d, canPrev: l });
+        const { current: s, canNext: d, canPrev: m } = n.payload || {};
+        a({ current: s, canNext: d, canPrev: m });
       }
-      i == null || i(n);
+      o == null || o(n);
     },
-    [i]
+    [o]
   );
-  return /* @__PURE__ */ u(O, { children: [
-    /* @__PURE__ */ u(R, { children: [
-      /* @__PURE__ */ u(j, { children: [
-        /* @__PURE__ */ r(P, { name: "icon-trophy-bet-pack" }),
+  return /* @__PURE__ */ f(R, { children: [
+    /* @__PURE__ */ f(j, { children: [
+      /* @__PURE__ */ f(E, { children: [
+        /* @__PURE__ */ r(x, { name: "icon-trophy-bet-pack" }),
         "LiveMatch Experience",
         " "
       ] }),
-      /* @__PURE__ */ r(E, { onClick: f, children: /* @__PURE__ */ r(P, { name: "icon-close-btn-gray" }) })
+      /* @__PURE__ */ r(M, { onClick: u, children: /* @__PURE__ */ r(x, { name: "icon-close-btn-gray" }) })
     ] }),
     /* @__PURE__ */ r(T, { children: /* @__PURE__ */ r(
-      Y,
+      q,
       {
-        sdk: m,
-        onEvent: c,
-        swipeable: !!o,
-        centerPadding: o ? "18px" : "50px",
-        heightOffset: o ? 0 : 35
+        sdk: l,
+        onEvent: i,
+        swipeable: !!c,
+        centerPadding: c ? "18px" : "30px",
+        heightOffset: c ? 0 : 48
       }
     ) }),
-    !o && /* @__PURE__ */ u(G, { children: [
-      /* @__PURE__ */ r(v, { onClick: t == null ? void 0 : t.prev, disabled: !(e != null && e.canPrev), children: /* @__PURE__ */ r(M, { name: "iconArrowPrev", className: x((e == null ? void 0 : e.canPrev) && w) }) }),
-      /* @__PURE__ */ r(v, { onClick: t == null ? void 0 : t.next, disabled: !(e != null && e.canNext), children: /* @__PURE__ */ r(U, { name: "iconArrowPrev", className: x((e == null ? void 0 : e.canNext) && w) }) })
+    !c && /* @__PURE__ */ f(G, { children: [
+      /* @__PURE__ */ r(v, { onClick: t == null ? void 0 : t.prev, disabled: !(e != null && e.canPrev), children: /* @__PURE__ */ r(U, { name: "iconArrowPrev", className: p((e == null ? void 0 : e.canPrev) && y) }) }),
+      /* @__PURE__ */ r(v, { onClick: t == null ? void 0 : t.next, disabled: !(e != null && e.canNext), children: /* @__PURE__ */ r(Y, { name: "iconArrowPrev", className: p((e == null ? void 0 : e.canNext) && y) }) })
     ] })
   ] });
-}, Y = H(({ sdk: m, swipeable: i = !0, heightOffset: f = 65, onEvent: o = I, centerPadding: t }) => {
-  const h = g(m.featuresList.getStore()), e = k(() => m.getFeature(N.GAMES), [h]), a = g(m.getUserStore()), c = B(null), [n, s] = p(), d = y(() => {
-    c.current && s(c.current.clientHeight);
+}, q = H(({ sdk: l, swipeable: o = !0, heightOffset: u = 65, onEvent: c = O, centerPadding: t }) => {
+  const h = P(l.featuresList.getStore()), e = B(() => l.getFeature(b.GAMES), [h]), a = P(l.getUserStore()), i = N(null), [n, s] = g(), d = S(() => {
+    i.current && s(i.current.clientHeight);
   }, []);
   return A(() => {
-    const l = () => {
-      c.current && s(c.current.clientHeight);
+    const m = C(() => {
+      i.current && s(i.current.clientHeight);
+    }, 200);
+    return window.addEventListener("resize", m), () => {
+      window.removeEventListener("resize", m);
     };
-    return window.addEventListener("resize", l), () => {
-      window.removeEventListener("resize", l);
-    };
-  }, []), a.data ? e ? /* @__PURE__ */ r(F, { ref: c, children: /* @__PURE__ */ r(
-    b,
+  }, []), a.data ? e ? /* @__PURE__ */ r(I, { ref: i, className: p("betPack", o && "isMobile"), children: /* @__PURE__ */ r(
+    L,
     {
       gamification: e,
-      onEvent: o,
-      swipeable: i,
+      onEvent: c,
+      swipeable: o,
       centerPadding: t,
       changeHeightOnInit: d,
-      height: n ? n - f : void 0
+      height: n ? n - u : void 0
     }
   ) }) : /* @__PURE__ */ r("div", { children: "no gamification" }) : a.error && !a.loading ? /* @__PURE__ */ r(
-    L,
+    z,
     {
-      actionFn: () => o({ type: "slHardRefresh" }),
-      description: "You are not authorized to view this resource."
+      actionFn: () => c({ type: "slHardRefresh" }),
+      description: `You are not authorized to
+view this resource.`
     }
-  ) : /* @__PURE__ */ r(z, {});
+  ) : /* @__PURE__ */ r(F, {});
 });
 export {
-  Y as BetPack,
-  re as BetPackOverlay
+  q as BetPack,
+  ne as BetPackOverlay
 };

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

@@ -41,7 +41,7 @@ const h = /* @__PURE__ */ l("div")({
     openedQuestion: i,
     isLoading: !!o
   }) : /* @__PURE__ */ e(b, {});
-}, A = ({
+}, H = ({
   gamification: t
 }) => {
   var i;
@@ -60,10 +60,10 @@ const h = /* @__PURE__ */ l("div")({
     }), o !== "question" && /* @__PURE__ */ e(x, {
       openedQuestion: r
     }), /* @__PURE__ */ e(p, {
-      mastersLogo: !0
+      mastersApp: !0
     })]
   });
 };
 export {
-  A as Question
+  H as Question
 };

package/lib/app/masters/Features/Gamification/Tabs.d.ts

@@ -1,13 +1,6 @@
-import { AppNodeRef, ScrollNodeRef } from '../../..';
-import { ResponsiveStore } from '../../useSdkResponsive';
-import { ScrollStore } from '../../useSdkScroll';
 import { Gamification } from '@streamlayer/feature-gamification';
 export declare const Tabs: React.FC<{
-    appNode: AppNodeRef;
     gamification: Gamification;
-    scrollStore: ScrollStore;
-    scrollNode: ScrollNodeRef;
-    responsiveStore: ResponsiveStore;
     className?: string;
     style?: React.CSSProperties;
 }>;

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

@@ -1,44 +1,11 @@
-import { jsxs as h, jsx as e, Fragment as x } from "react/jsx-runtime";
-import { TabsContainer as D, TabsNavContainer as T, SDKWhiteContainer as v, UserSummaryContainer as C, SDKContentContainer as A, LeaderboardContainer as I } from "../../styles.js";
-import { scrollIntoAppView as P } from "../../useSdkScroll.js";
-import { useState as S, useEffect as V } from "react";
-import { useStore as u, useTransition as E } from "@streamlayer/react-polyfills";
-import { ActivePages as a, Tabs as K } from "../../../../ui/gamification/tabs/index.js";
-import { Leaderboard as L } from "./Leaderboard.js";
-import { QuestionsList as F } from "./QuestionsList.js";
-import { UserSummary as O } from "./UserSummary.js";
-const q = ({ gamification: s, className: f, scrollStore: t, scrollNode: l, appNode: c, style: b, responsiveStore: n }) => {
-  const { tabsShown: d } = u(t, { keys: ["tabsShown"] }), [i, w] = S(a.HOME), [, y] = E(), { sdkInDesktopView: m, screen: g } = u(n, { keys: ["sdkInDesktopView"] }), k = (r) => {
-    y(() => {
-      var p;
-      w(r), m === !1 && (((p = c.current) == null ? void 0 : p.getBoundingClientRect().y) || 0) < 0 && P(c, g.size, { behavior: "instant" });
-    });
-  };
-  V(() => t.subscribe((r) => {
-    if (r.scrollPosition === 0) {
-      t.setKey("tabsShown", !0);
-      return;
-    }
-    n.get().sdkInDesktopView ? t.setKey("tabsShown", r.scrollDirection === "backward") : t.setKey("tabsShown", r.scrollDirection === "forward");
-  }), [t, n]);
-  let o = "0px";
-  return m ? o = d ? "0px" : "calc(8px - var(--header-height) - var(--header-offset))" : o = d ? "calc(var(--header-height) + var(--header-offset) - 2px)" : "0px", /* @__PURE__ */ h(D, { className: f, style: b, children: [
-    /* @__PURE__ */ e(
-      T,
-      {
-        style: {
-          top: o
-        },
-        children: /* @__PURE__ */ e(K, { activePage: i, toggleActivePage: k })
-      }
-    ),
-    i === a.HOME && /* @__PURE__ */ h(x, { children: [
-      /* @__PURE__ */ e(v, { style: { paddingTop: "8px" }, children: /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(O, { userSummary: s.userSummary }) }) }),
-      /* @__PURE__ */ e(A, { style: { flex: 1 }, children: /* @__PURE__ */ e(F, { openQuestion: s.openQuestion, store: s.feedList.getStore() }) })
-    ] }),
-    i === a.LEADERBOARD && /* @__PURE__ */ e(I, { children: /* @__PURE__ */ e(L, { scrollStore: t, scrollNode: l, gamification: s }) })
-  ] });
-};
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { TabsContainer as s, SDKWhiteContainer as m, UserSummaryContainer as i, SDKContentContainer as p } from "../../styles.js";
+import { QuestionsList as u } from "./QuestionsList.js";
+import { UserSummary as a } from "./UserSummary.js";
+const h = ({ gamification: r, className: t, style: o }) => /* @__PURE__ */ n(s, { className: t, style: o, children: [
+  /* @__PURE__ */ e(m, { style: { paddingTop: "8px" }, children: /* @__PURE__ */ e(i, { children: /* @__PURE__ */ e(a, { userSummary: r.userSummary }) }) }),
+  /* @__PURE__ */ e(p, { style: { flex: 1 }, children: /* @__PURE__ */ e(u, { openQuestion: r.openQuestion, store: r.feedList.getStore() }) })
+] });
 export {
-  q as Tabs
+  h as Tabs
 };

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

@@ -1,18 +1,19 @@
 import { jsx as m } from "react/jsx-runtime";
-import { useState as i, useEffect as n } from "react";
-import { UserStatistics as a } from "../../../../ui/gamification/user-statistics/index.js";
-const b = ({ userSummary: r }) => {
-  var e;
-  const [t, s] = i(void 0);
-  return n(() => {
-    const c = r.$store.subscribe((o) => {
-      o && s(o);
-    });
-    return () => {
-      c();
-    };
-  }, [r]), /* @__PURE__ */ m(a, { loading: !(t != null && t.summary), ...t == null ? void 0 : t.summary, successRate: (e = t == null ? void 0 : t.percentage) == null ? void 0 : e.correct });
+import { useStore as e } from "@streamlayer/react-polyfills";
+import { UserStatistics as s } from "../../../../ui/gamification/user-statistics/index.js";
+const n = ({ userSummary: o }) => {
+  var t;
+  const r = e(o.$store);
+  return /* @__PURE__ */ m(
+    s,
+    {
+      hideFriendsRank: !0,
+      loading: !(r != null && r.summary),
+      ...r == null ? void 0 : r.summary,
+      successRate: (t = r == null ? void 0 : r.percentage) == null ? void 0 : t.correct
+    }
+  );
 };
 export {
-  b as UserSummary
+  n as UserSummary
 };

package/lib/app/masters/Features/Gamification/index.d.ts

@@ -1,14 +1,9 @@
-import { AppNodeRef, ScrollNodeRef } from '../../..';
+import { AppNodeRef } from '../../..';
 import { ResponsiveStore } from '../../useSdkResponsive';
-import { ScrollStore } from '../../useSdkScroll';
 import { Gamification as GamificationClass } from '@streamlayer/feature-gamification';
 export declare const GamificationOverlay: React.FC<{
     gamification: GamificationClass;
     className?: string;
-    scrollStore: ScrollStore;
-    responsiveStore: ResponsiveStore;
-    appNode: AppNodeRef;
-    scrollNode: ScrollNodeRef;
 }>;
 /**
  * Standalone version of the gamification overlay

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

@@ -1,88 +1,49 @@
-import { jsx as n, jsxs as f } from "react/jsx-runtime";
-import { styled as m } from "@linaria/react";
-import { SDKWhiteContainer as h } from "../../styles.js";
-import { useHideTransition as C } from "../../../../hooks/showIn.js";
-import { useStore as a } from "@streamlayer/react-polyfills";
-import { VoteHeader as k } from "../../../../ui/gamification/detail/header/index.js";
-import { UserStatistics as S } from "../../../../ui/gamification/user-statistics/index.js";
-import { ModalPortal as U } from "../../../../ui/modal/index.js";
-import { ShowIn as y } from "../../../../ui/show-in/index.js";
-import { Question as I } from "./Question.js";
-import { Tabs as v } from "./Tabs.js";
-const x = () => y, p = /* @__PURE__ */ m(x())({
+import { jsx as n } from "react/jsx-runtime";
+import { styled as u } from "@linaria/react";
+import { useHideTransition as c } from "../../../../hooks/showIn.js";
+import { useStore as t } from "@streamlayer/react-polyfills";
+import { ModalPortal as d } from "../../../../ui/modal/index.js";
+import { ShowIn as l } from "../../../../ui/show-in/index.js";
+import { Question as f } from "./Question.js";
+import { Tabs as k } from "./Tabs.js";
+const h = () => l, y = /* @__PURE__ */ u(h())({
   name: "OpenedContainer",
   class: "o1seszvt",
   propsAsIs: !0
-}), O = /* @__PURE__ */ m("div")({
-  name: "UserContainer",
-  class: "u1pbry50",
-  propsAsIs: !1
-}), b = ({
-  correct: e,
-  incorrect: r
-}) => {
-  const o = e + r;
-  return o === 0 ? 0 : Math.round(e / o * 100);
-}, z = ({
-  gamification: e,
-  scrollStore: r,
-  className: o,
-  appNode: i,
-  scrollNode: s,
-  responsiveStore: t
-}) => /* @__PURE__ */ n(v, {
-  appNode: i,
-  scrollStore: r,
-  scrollNode: s,
-  className: o,
-  gamification: e,
-  responsiveStore: t
-}), E = ({
-  gamification: e,
-  className: r,
-  appNode: o,
+}), A = ({
+  gamification: o,
+  className: e
+}) => /* @__PURE__ */ n(k, {
+  className: e,
+  gamification: o
+}), D = ({
+  gamification: o,
+  className: e,
+  appNode: r,
   responsiveStore: i
 }) => {
-  const s = a(e.openedQuestion.$store), t = a(e.openedUser), {
-    sdkInDesktopView: d
-  } = a(i, {
+  const s = t(o.openedQuestion.$store), {
+    sdkInDesktopView: m
+  } = t(i, {
     keys: ["sdkInDesktopView"]
   }), {
-    hiding: c,
-    onAnimationEnd: l
-  } = C();
-  if (!o.current || !s && !t)
-    return null;
-  const u = s ? /* @__PURE__ */ n(p, {
-    className: r,
-    hiding: c,
-    onAnimationEnd: l,
-    children: /* @__PURE__ */ n(I, {
-      gamification: e
-    })
-  }) : t ? /* @__PURE__ */ n(p, {
-    className: r,
-    hiding: c,
-    onAnimationEnd: l,
-    children: /* @__PURE__ */ f(O, {
-      children: [/* @__PURE__ */ n(k, {
-        label: "Friend's Rank",
-        close: e.closeUser
-      }), /* @__PURE__ */ n(h, {
-        children: /* @__PURE__ */ n(S, {
-          ...t,
-          successRate: b(t)
-        })
-      })]
+    hiding: a,
+    onAnimationEnd: p
+  } = c();
+  return !r.current || !s ? null : /* @__PURE__ */ n(d, {
+    container: r,
+    useContainer: !m,
+    children: /* @__PURE__ */ n(y, {
+      className: e,
+      hiding: a,
+      onAnimationEnd: p,
+      children: /* @__PURE__ */ n(f, {
+        gamification: o
+      })
     })
-  }) : null;
-  return /* @__PURE__ */ n(U, {
-    container: o,
-    useContainer: !d,
-    children: u
   });
 };
 export {
-  z as GamificationOverlay,
-  E as GamificationOverlayStandalone
+  A as GamificationOverlay,
+  D as GamificationOverlayStandalone
 };

package/lib/app/masters/Features/index.d.ts

@@ -1,16 +1,11 @@
-import { AppNodeRef, ScrollNodeRef } from '../..';
+import { AppNodeRef } from '../..';
 import { ResponsiveStore } from '../useSdkResponsive';
-import { ScrollStore } from '../useSdkScroll';
 import { Features } from '@streamlayer/sdk-web-features';
 import { StreamLayerSDK } from '@streamlayer/sdk-web-interfaces';
 /** render feature by type */
 export declare const ActiveFeature: React.FC<{
     sdk: StreamLayerSDK;
     feature: Features | null;
-    scrollStore: ScrollStore;
-    responsiveStore: ResponsiveStore;
-    appNode: AppNodeRef;
-    scrollNode: ScrollNodeRef;
     className?: string;
 }>;
 /** render feature by type */

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

@@ -1,37 +1,27 @@
 import { jsx as r } from "react/jsx-runtime";
-import { lazy as f, useMemo as c, Suspense as g } from "react";
-import { FeatureType as m } from "@streamlayer/sdk-web-types";
-import { FeatureProvider as p } from "./FeatureProvider.js";
-import { GamificationOverlayStandalone as y } from "./Gamification/index.js";
-const d = f(() => import("./Gamification/gamification-feature.js")), x = ({ sdk: i, feature: t, className: n, scrollStore: e, appNode: o, scrollNode: a, responsiveStore: l }) => {
-  const u = c(() => t && t.featureConfig.get().type === m.GAMES ? /* @__PURE__ */ r(p, { className: n, sdk: i, feature: t, children: /* @__PURE__ */ r(
-    d,
-    {
-      appNode: o,
-      scrollStore: e,
-      scrollNode: a,
-      className: n,
-      responsiveStore: l,
-      gamification: t
-    }
-  ) }) : null, [i, t, n, l, e, a, o]);
+import { lazy as l, useMemo as a, Suspense as m } from "react";
+import { FeatureType as o } from "@streamlayer/sdk-web-types";
+import { FeatureProvider as u } from "./FeatureProvider.js";
+import { GamificationOverlayStandalone as f } from "./Gamification/index.js";
+const c = l(() => import("./Gamification/gamification-feature.js")), h = ({ sdk: e, feature: t, className: i }) => {
+  const n = a(() => t && t.featureConfig.get().type === o.GAMES ? /* @__PURE__ */ r(u, { className: i, sdk: e, feature: t, children: /* @__PURE__ */ r(c, { className: i, gamification: t }) }) : null, [e, t, i]);
   return /* @__PURE__ */ r(
-    g,
+    m,
     {
       fallback: /* @__PURE__ */ r("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "100%" }, children: "page loading..." }),
-      children: u
+      children: n
     }
   );
-}, A = ({ feature: i, className: t, appNode: n, responsiveStore: e }) => i && i.featureConfig.get().type === m.GAMES ? /* @__PURE__ */ r(
-  y,
+}, v = ({ feature: e, className: t, appNode: i, responsiveStore: n }) => e && e.featureConfig.get().type === o.GAMES ? /* @__PURE__ */ r(
+  f,
   {
     className: t,
-    appNode: n,
-    responsiveStore: e,
-    gamification: i
+    appNode: i,
+    responsiveStore: n,
+    gamification: e
   }
 ) : null;
 export {
-  x as ActiveFeature,
-  A as StandaloneFeature
+  h as ActiveFeature,
+  v as StandaloneFeature
 };

package/lib/app/masters/Header/index.d.ts

@@ -0,0 +1,3 @@
+export declare const SDKHeader: import('react').ForwardRefExoticComponent<{
+    className?: string;
+} & import('react').RefAttributes<HTMLDivElement | null>>;

package/lib/app/masters/Header/index.js

@@ -0,0 +1,38 @@
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { cx as a } from "@linaria/core";
+import { styled as s } from "@linaria/react";
+import { forwardRef as t } from "react";
+import { SvgIcon as c } from "../../../ui/icons/index.js";
+const i = /* @__PURE__ */ s("div")({
+  name: "Navigation",
+  class: "n1o1tw60",
+  propsAsIs: !1
+}), m = /* @__PURE__ */ s("div")({
+  name: "Container",
+  class: "co2rstw",
+  propsAsIs: !1
+}), p = /* @__PURE__ */ s("div")({
+  name: "Title",
+  class: "t1bqnx9c",
+  propsAsIs: !1
+}), l = () => c, d = /* @__PURE__ */ s(l())({
+  name: "HeaderIcon",
+  class: "hlc2pcy",
+  propsAsIs: !0
+}), f = "h1aqxe8k", g = t(({
+  className: o
+}, n) => /* @__PURE__ */ r(i, {
+  className: a(o, f),
+  children: [/* @__PURE__ */ e(m, {
+    children: /* @__PURE__ */ r(p, {
+      children: [/* @__PURE__ */ e(d, {
+        name: "icon-trivia-transparent"
+      }), "Game Center"]
+    })
+  }), /* @__PURE__ */ e("div", {
+    ref: n
+  })]
+}));
+export {
+  g as SDKHeader
+};

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

@@ -3,7 +3,7 @@ import { cx as N } from "@linaria/core";
 import { useMastersContext as T } from "../useMastersContext.js";
 import { scrollIntoAppView as q } from "../useSdkScroll.js";
 import { useState as p, useMemo as E, useEffect as h, useRef as O, useCallback as w } from "react";
-import { r as b } from "../../../index-B1QdimmR.js";
+import { r as b } from "../../../index-DALxy-8N.js";
 import { useStore as g } from "@streamlayer/react-polyfills";
 import { eventBus as C } from "@streamlayer/sdk-web-interfaces";
 import { NotificationType as a } from "@streamlayer/sdk-web-notifications";

package/lib/app/masters/masters.d.ts

@@ -7,5 +7,6 @@ export type MastersAppChildrenProps = {
 };
 export type MastersAppProps = {
     sdk: StreamLayerSDK;
+    betPack?: boolean;
 };
 export declare const MastersApp: React.FC<MastersAppProps>;