@streamlayer/react-ui 1.14.3 → 1.16.0

package/lib/app/app/Advertisement/index.js

@@ -1,9 +1,9 @@
 import { jsx as s } from "react/jsx-runtime";
 import { cx as b } from "@linaria/core";
 import { styled as L } from "@linaria/react";
-import { useStore as g } from "@nanostores/react";
 import { useAnalyticsListener as P } from "../../../hooks/analytics.js";
 import { useEffect as w, useRef as I } from "react";
+import { useStore as g } from "@streamlayer/react-polyfills";
 import { eventBus as A } from "@streamlayer/sdk-web-interfaces";
 import { FeatureType as E, NotificationPromotionMode as T, PromotionType as U } from "@streamlayer/sdk-web-types";
 import { AdvertisementUI as N } from "../../../ui/advertisement/index.js";

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

@@ -1,6 +1,6 @@
 import { jsx as e } from "react/jsx-runtime";
 import { styled as u } from "@linaria/react";
-import { useStore as i } from "@nanostores/react";
+import { useStore as i } from "@streamlayer/react-polyfills";
 import { FeatureStatus as c } from "@streamlayer/sdk-web-interfaces";
 const o = /* @__PURE__ */ u("div")({
   name: "LoadingContainer",

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

@@ -1,12 +1,13 @@
 import { jsx as r, jsxs as f, Fragment as L } from "react/jsx-runtime";
 import { styled as h } from "@linaria/react";
-import { useStore as i } from "@nanostores/react";
 import { useClipboardCopy as k } from "../../../useClipboardCopy.js";
 import { useRef as u } from "react";
+import { useStore as n } from "@streamlayer/react-polyfills";
 import { InviteLink as I } from "../../../../ui/gamification/invite-link/index.js";
 import "react-virtualized-auto-sizer";
 import "react-window";
 import "react-window-infinite-loader";
+import "@storybook/blocks";
 import "../../../../ui/icons/index.js";
 import "../../../../ui/gamification/leaderboard/list-item/styles.js";
 /* empty css                                    */
@@ -16,24 +17,24 @@ const C = /* @__PURE__ */ h("div")({
   name: "InviteLinkContainer",
   class: "i1odbhm4",
   propsAsIs: !1
-}), q = ({
+}), z = ({
   gamification: e,
   scrollNode: s,
   scrollStore: p
 }) => {
   const t = u(null), {
-    data: n,
+    data: i,
     hasMore: d,
     loading: m,
     key: l
-  } = i(e.leaderboardList.$store), {
+  } = n(e.leaderboardList.$store), {
     data: o
-  } = i(e.deepLink.$store), [a, c] = k(t);
-  return !n.length && !m ? /* @__PURE__ */ r(y, {
+  } = n(e.deepLink.$store), [a, c] = k(t);
+  return !i.length && !m ? /* @__PURE__ */ r(y, {
     deepLink: o
   }) : /* @__PURE__ */ f(L, {
     children: [/* @__PURE__ */ r(b, {
-      items: n,
+      items: i,
       scrollNode: s,
       scrollStore: p,
       fetchMore: e.leaderboardList.fetchMore,
@@ -51,5 +52,5 @@ const C = /* @__PURE__ */ h("div")({
   });
 };
 export {
-  q as Leaderboard
+  z as Leaderboard
 };

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

@@ -1,7 +1,7 @@
 import { jsxs as y, jsx as e } from "react/jsx-runtime";
 import { styled as v } from "@linaria/react";
-import { useStore as d } from "@nanostores/react";
 import { useAppContext as T } from "../../useAppContext.js";
+import { useStore as d } from "@streamlayer/react-polyfills";
 import { QuestionType as V } from "@streamlayer/sdk-web-types";
 import { VoteHeader as h } from "../../../../ui/gamification/detail/header/index.js";
 import { Sponsor as x } from "../../../../ui/gamification/detail/sponsor/index.js";

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

@@ -1,9 +1,9 @@
 import { jsx as s } from "react/jsx-runtime";
-import { useStore as i } from "@nanostores/react";
-import { useAppContext as n } from "../../useAppContext.js";
+import { useAppContext as i } from "../../useAppContext.js";
+import { useStore as n } from "@streamlayer/react-polyfills";
 import { QuestionList as m } from "../../../../ui/gamification/question/list/index.js";
 const a = ({ store: t, openQuestion: r }) => {
-  const { sdk: o } = n(), e = i(t);
+  const { sdk: o } = i(), e = n(t);
   return /* @__PURE__ */ s(m, { openQuestion: r, questions: e.data, controlVideo: o == null ? void 0 : o.controlVideoPlayer });
 };
 export {

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

@@ -1,9 +1,9 @@
 import { jsxs as f, jsx as e, Fragment as D } from "react/jsx-runtime";
 import { cx as C } from "@linaria/core";
-import { useStore as c } from "@nanostores/react";
 import { TabsContainer as S, TabsNavContainer as E, SDKSummaryContainer as v, UserSummaryContainer as A, SDKContentContainer as I, LeaderboardContainer as L } from "../../styles.js";
 import { scrollIntoAppView as P } from "../../../useSdkScroll.js";
-import { useState as V, useTransition as K, useEffect as l } from "react";
+import { useState as V, useEffect as l } from "react";
+import { useStore as c, useTransition as K } from "@streamlayer/react-polyfills";
 import { ActivePages as n, Tabs as F } from "../../../../ui/gamification/tabs/index.js";
 import { Leaderboard as O } from "./Leaderboard.js";
 import { QuestionsList as H } from "./QuestionsList.js";

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

@@ -1,10 +1,10 @@
 import { jsx as o, jsxs as x } from "react/jsx-runtime";
 import { cx as l } from "@linaria/core";
 import { styled as f } from "@linaria/react";
-import { useStore as c } from "@nanostores/react";
 import { SDKWhiteContainer as k } from "../../styles.js";
 import { useAppContext as v } from "../../useAppContext.js";
 import { useHideTransition as S } from "../../../../hooks/showIn.js";
+import { useStore as c } from "@streamlayer/react-polyfills";
 import { VoteHeader as U } from "../../../../ui/gamification/detail/header/index.js";
 import { UserStatistics as I } from "../../../../ui/gamification/user-statistics/index.js";
 import { ModalPortal as y } from "../../../../ui/modal/index.js";

package/lib/app/app/InApp/index.d.ts

@@ -0,0 +1,4 @@
+import { StreamLayerSDK } from '@streamlayer/sdk-web-interfaces';
+export declare const StreamLayerSDKNotification: React.FC<{
+    sdk: StreamLayerSDK;
+}>;

package/lib/app/app/InApp/index.js

@@ -0,0 +1,31 @@
+import { jsx as i } from "react/jsx-runtime";
+import { useState as p, useMemo as c, useEffect as s } from "react";
+import { useStore as u } from "@streamlayer/react-polyfills";
+import { eventBus as f } from "@streamlayer/sdk-web-interfaces";
+import { NotificationType as n } from "@streamlayer/sdk-web-notifications";
+import { FeatureType as m, QuestionType as d } from "@streamlayer/sdk-web-types";
+import { InAppNotification as l } from "../../../ui/gamification/question/inapp/notification/index.js";
+import { InAppOnboarding as y } from "../../../ui/gamification/question/inapp/onboarding/index.js";
+import { InAppPredictionResult as I } from "../../../ui/gamification/question/inapp/prediction-result/index.js";
+const R = ({ sdk: o }) => {
+  const [r] = p(o.getNotificationsStore()), a = u(r), e = o.getFeature(m.GAMES), t = c(() => o.getActiveNotification(), [o, a]);
+  return s(() => {
+    t && f.emit("notification", {
+      action: "rendered",
+      payload: {
+        questionId: t.data.questionId,
+        questionType: t.data.questionType
+      }
+    });
+  }, [t]), t && t.type === n.QUESTION_RESOLVED ? t.data.question && t.data.questionType === d.PREDICTION ? /* @__PURE__ */ i(
+    I,
+    {
+      action: t.action,
+      close: t.close,
+      ...t.data.question
+    }
+  ) : null : t && t.type === n.ONBOARDING ? t.data.onboarding ? /* @__PURE__ */ i(y, { open: e == null ? void 0 : e.openFeature, close: t.close, ...t.data.onboarding }) : null : t && /* @__PURE__ */ i(l, { ...t.data, action: t.action });
+};
+export {
+  R as StreamLayerSDKNotification
+};

package/lib/app/app/Insight/index.js

@@ -1,7 +1,7 @@
 import { jsx as d } from "react/jsx-runtime";
 import { styled as i } from "@linaria/react";
-import { useStore as Q } from "@nanostores/react";
 import { useRef as l, useEffect as m } from "react";
+import { useStore as Q } from "@streamlayer/react-polyfills";
 import { FeatureType as S } from "@streamlayer/sdk-web-types";
 import { Question as y } from "../Features/Gamification/Question.js";
 const I = () => y, b = /* @__PURE__ */ i(I())({

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

@@ -1,8 +1,8 @@
 import { jsxs as c, jsx as e } from "react/jsx-runtime";
 import { cx as S } from "@linaria/core";
 import { styled as n } from "@linaria/react";
-import { useStore as v } from "@nanostores/react";
 import { forwardRef as y, useMemo as u } from "react";
+import { useStore as v } from "@streamlayer/react-polyfills";
 import { AvailableFeatures as b } from "@streamlayer/sdk-web-features";
 import { FeatureType as C } from "@streamlayer/sdk-web-types";
 import { SvgIcon as h } from "../../../ui/icons/index.js";

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

@@ -1,19 +1,19 @@
-import { jsx as r, jsxs as L, Fragment as x } from "react/jsx-runtime";
-import { styled as I } from "@linaria/react";
-import { useStore as T } from "@nanostores/react";
-import { useImagesPreload as O } from "../../../useImagesPreload.js";
-import { scrollIntoAppView as _ } from "../../../useSdkScroll.js";
-import { useRef as E, useState as A, useMemo as F, useLayoutEffect as M, useEffect as R } from "react";
-import { FeatureType as V } from "@streamlayer/sdk-web-types";
-import { OnboardingUI as W } from "../../../../ui/gamification/onboarding/index.js";
-import { ModalPortal as $ } from "../../../../ui/modal/index.js";
-import { ShowIn as j } from "../../../../ui/show-in/index.js";
-import { Onboarding as w } from "./Notification/index.js";
+import { jsx as n, jsxs as w, Fragment as O } from "react/jsx-runtime";
+import { styled as y } from "@linaria/react";
+import { useImagesPreload as _ } from "../../../useImagesPreload.js";
+import { scrollIntoAppView as E } from "../../../useSdkScroll.js";
+import { useRef as M, useState as T, useMemo as A, useLayoutEffect as R, useEffect as V } from "react";
+import { useStore as F } from "@streamlayer/react-polyfills";
+import { FeatureType as W } from "@streamlayer/sdk-web-types";
+import { OnboardingUI as $ } from "../../../../ui/gamification/onboarding/index.js";
+import { ModalPortal as j } from "../../../../ui/modal/index.js";
+import { ShowIn as P } from "../../../../ui/show-in/index.js";
+import { Onboarding as L } from "./Notification/index.js";
 const C = [{
   graphicSrc: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/dark/step_1.png",
   tagline: "",
-  headline: /* @__PURE__ */ L(x, {
-    children: ["Welcome to ", /* @__PURE__ */ r("br", {}), " Live Challenge"]
+  headline: /* @__PURE__ */ w(O, {
+    children: ["Welcome to ", /* @__PURE__ */ n("br", {}), " Live Challenge"]
   })
 }, {
   graphicSrc: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/dark/step_2.png",
@@ -21,43 +21,48 @@ const C = [{
 }, {
   graphicSrc: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/dark/step_3.png",
   headline: "Win points and play against friends."
-}], P = /* @__PURE__ */ I("div")({
+}], q = /* @__PURE__ */ y("div")({
   name: "OnboardingContainer",
   class: "o1xni1kr",
   propsAsIs: !1
-}), q = () => j, z = /* @__PURE__ */ I(q())({
+}), z = () => P, D = /* @__PURE__ */ y(z())({
   name: "OnboardingNotificationContainer",
   class: "o1vnouv7",
   propsAsIs: !0
-}), S = /* @__PURE__ */ I("div")({
+}), x = /* @__PURE__ */ y("div")({
   name: "InnerContainer",
   class: "i59uefw",
   propsAsIs: !1
-}), D = ({
+}), G = /* @__PURE__ */ y("div")({
+  name: "OnboardingOverlap",
+  class: "ovnr8ov",
+  propsAsIs: !1
+}), U = ({
   deepLink: l,
   onboardingOpts: e,
   notification: o,
-  gamification: m,
+  gamification: p,
   loading: s,
-  sdk: d
+  sdk: d,
+  throttled: I
 }) => {
-  var c, a, b, h, f, v, i;
-  const p = T(m.friends.getStore()), [g, t] = A(void 0), y = F(() => {
-    var u, k;
-    const n = d.getInviter();
-    return n ? (k = (u = p.data) == null ? void 0 : u.find(({
+  var a, b, h, f, v, t, u;
+  const c = F(p.friends.getStore()), [r, k] = T(void 0), g = A(() => {
+    var m, S;
+    const i = d.getInviter();
+    return i ? (S = (m = c.data) == null ? void 0 : m.find(({
       slId: B
-    }) => B === n)) == null ? void 0 : k.name : "";
-  }, [p.data, d]);
-  return R(() => {
-    const n = l.$store.subscribe((u) => {
-      u && t(u.data);
+    }) => B === i)) == null ? void 0 : S.name : "";
+  }, [c.data, d]);
+  return V(() => {
+    const i = l.$store.subscribe((m) => {
+      m && k(m.data);
     });
     return () => {
-      n();
+      i();
     };
-  }, [l.$store]), /* @__PURE__ */ r(P, {
-    children: /* @__PURE__ */ r(W, {
+  }, [l.$store]), /* @__PURE__ */ w(q, {
+    children: [/* @__PURE__ */ n($, {
       loading: s,
       rules: [{
         label: "Answer as many questions as you like.",
@@ -69,94 +74,95 @@ const C = [{
         label: "Top the leader board and best your friends.",
         icon: "icon-trophy"
       }],
-      rulesBtnLabel: (c = e.rules) == null ? void 0 : c.buttonLabel,
-      rulesTitle: (a = e.rules) == null ? void 0 : a.heading,
+      rulesBtnLabel: (a = e.rules) == null ? void 0 : a.buttonLabel,
+      rulesTitle: (b = e.rules) == null ? void 0 : b.heading,
       termsTitle: "Terms and Conditions",
-      termsText: (b = e.rules) == null ? void 0 : b.terms,
+      termsText: (h = e.rules) == null ? void 0 : h.terms,
       steps: C,
-      primaryColor: (h = e.inviteCard) == null ? void 0 : h.iconColor,
-      inviteLink: g,
-      inviteCardTitle: (f = e.inviteCard) == null ? void 0 : f.heading,
-      inviteCardSubtext: (v = e.inviteCard) == null ? void 0 : v.subtext,
-      inviteCardBtnLabel: (i = e.inviteCard) == null ? void 0 : i.buttonLabel,
+      primaryColor: (f = e.inviteCard) == null ? void 0 : f.iconColor,
+      inviteLink: r,
+      inviteCardTitle: (v = e.inviteCard) == null ? void 0 : v.heading,
+      inviteCardSubtext: (t = e.inviteCard) == null ? void 0 : t.subtext,
+      inviteCardBtnLabel: (u = e.inviteCard) == null ? void 0 : u.buttonLabel,
       onClose: () => {
-        var n;
-        (n = o.close) == null || n.call(o);
+        var i;
+        (i = o.close) == null || i.call(o);
       },
-      gamification: m,
+      gamification: p,
       sdk: d,
-      inviterName: y
-    })
+      inviterName: g
+    }), I && /* @__PURE__ */ n(G, {})]
   });
-}, ne = ({
+}, te = ({
   sdk: l,
   notification: e,
   saveHeight: o,
-  style: m,
+  style: p,
   appNode: s,
   sdkInDesktopView: d,
-  responsiveStore: p
+  responsiveStore: I
 }) => {
-  const g = E(null), t = e.data.onboarding, [y, c] = A(t == null ? void 0 : t.instantOpen), a = l.getFeature(V.GAMES), b = F(() => C == null ? void 0 : C.map(({
-    graphicSrc: i
-  }) => i), []), {
+  const c = M(null), r = e.data.onboarding, [k, g] = T(r == null ? void 0 : r.instantOpen), a = l.getFeature(W.GAMES), b = A(() => C == null ? void 0 : C.map(({
+    graphicSrc: t
+  }) => t), []), {
     screen: h
-  } = T(p, {
+  } = F(I, {
     keys: ["screen"]
   });
-  M(() => {
-    var i;
-    o(((i = g.current) == null ? void 0 : i.getBoundingClientRect().height) || 0);
+  R(() => {
+    var t;
+    o(((t = c.current) == null ? void 0 : t.getBoundingClientRect().height) || 0);
   }, [o]);
   const {
     loading: f,
     throttled: v
-  } = O(b);
-  return y && a && t && s.current && !v ? /* @__PURE__ */ r($, {
+  } = _(b);
+  return k && a && r && s.current ? /* @__PURE__ */ n(j, {
     container: s,
     useContainer: !d,
-    children: /* @__PURE__ */ r(D, {
+    children: /* @__PURE__ */ n(U, {
+      throttled: v,
       notification: e,
-      setOpened: c,
+      setOpened: g,
       gamification: a,
-      onboardingOpts: t,
+      onboardingOpts: r,
       deepLink: a.deepLink,
       loading: f,
       renderToNode: s,
       sdk: l
     })
-  }) : /* @__PURE__ */ L(x, {
-    children: [/* @__PURE__ */ r(S, {
-      ref: g,
+  }) : /* @__PURE__ */ w(O, {
+    children: [/* @__PURE__ */ n(x, {
+      ref: c,
       style: {
         position: "absolute",
         visibility: "hidden"
       },
-      children: /* @__PURE__ */ r(w, {
+      children: /* @__PURE__ */ n(L, {
         close: () => {
         },
         action: () => {
         },
-        onboarding: t
+        onboarding: r
       })
-    }), /* @__PURE__ */ r(z, {
-      style: m,
+    }), /* @__PURE__ */ n(D, {
+      style: p,
       hiding: e.hiding,
-      children: /* @__PURE__ */ r(S, {
-        children: /* @__PURE__ */ r(w, {
+      children: /* @__PURE__ */ n(x, {
+        children: /* @__PURE__ */ n(L, {
           close: e.close,
           action: () => {
-            var n;
-            c(!0), (((n = s.current) == null ? void 0 : n.getBoundingClientRect().y) || 0) < 0 && _(s, h.size, {
+            var u;
+            g(!0), (((u = s.current) == null ? void 0 : u.getBoundingClientRect().y) || 0) < 0 && E(s, h.size, {
               behavior: "smooth"
             });
           },
-          onboarding: t
+          onboarding: r
         })
       })
     })]
   });
 };
 export {
-  ne as Onboarding
+  te as Onboarding
 };

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

@@ -1,10 +1,10 @@
 import { jsxs as k, Fragment as b, jsx as u } from "react/jsx-runtime";
 import { cx as V } from "@linaria/core";
-import { useStore as y } from "@nanostores/react";
 import { useAppContext as O } from "../useAppContext.js";
 import { scrollIntoAppView as T } from "../../useSdkScroll.js";
 import { useState as I, useMemo as D, useEffect as a, useRef as E, useCallback as w } from "react";
 import { r as R } from "../../../index-B1QdimmR.js";
+import { useStore as y } from "@streamlayer/react-polyfills";
 import { eventBus as q } from "@streamlayer/sdk-web-interfaces";
 import { NotificationType as p } from "@streamlayer/sdk-web-notifications";
 import { QuestionTypeData as C } from "../../../ui/gamification/constants.js";

package/lib/app/app/Points/index.js

@@ -1,12 +1,12 @@
 import { jsx as n } from "react/jsx-runtime";
-import { useStore as f } from "@nanostores/react";
-import { useState as c, useEffect as l } from "react";
+import { useState as f, useEffect as c } from "react";
+import { useStore as l } from "@streamlayer/react-polyfills";
 import { FeatureStatus as u } from "@streamlayer/sdk-web-interfaces";
 import { FeatureType as p } from "@streamlayer/sdk-web-types";
 import { Points as S } from "../../../ui/gamification/points/index.js";
 const a = ({ gamification: e }) => {
-  const s = e.userSummary.$store, [r, m] = c(0);
-  return l(() => {
+  const s = e.userSummary.$store, [r, m] = f(0);
+  return c(() => {
     const i = s.subscribe((t) => {
       var o;
       (o = t == null ? void 0 : t.summary) != null && o.points && m(t.summary.points);
@@ -18,7 +18,7 @@ const a = ({ gamification: e }) => {
     e.status.get() === u.Suspended ? e.openFeature() : e.status.get() === u.Ready && e.closeFeature(!1);
   } });
 }, k = ({ sdk: e }) => {
-  if (!f(e.featuresList.getStore()))
+  if (!l(e.featuresList.getStore()))
     return null;
   const r = e.getFeature(p.GAMES);
   return r ? /* @__PURE__ */ n(a, { gamification: r }) : null;

package/lib/app/app/index.js

@@ -1,12 +1,12 @@
 import { jsx as l, jsxs as f } from "react/jsx-runtime";
 import { cx as v } from "@linaria/core";
-import { useStore as N } from "@nanostores/react";
-import { SDKContainer as A, SDKScrollContainer as F } from "./styles.js";
-import { useSdkFeature as x } from "../useSdkFeature.js";
-import { useSdkResponsive as D } from "../useSdkResponsive.js";
-import { useSdkScroll as L } from "../useSdkScroll.js";
-import { useAnalyticsListener as u, newTabLinkListener as g, appScrollListener as C, appClickListener as b } from "../../hooks/analytics.js";
-import { useRef as p, useMemo as y, useEffect as K } from "react";
+import { SDKContainer as N, SDKScrollContainer as A } from "./styles.js";
+import { useSdkFeature as F } from "../useSdkFeature.js";
+import { useSdkResponsive as x } from "../useSdkResponsive.js";
+import { useSdkScroll as D } from "../useSdkScroll.js";
+import { useAnalyticsListener as u, newTabLinkListener as L, appScrollListener as g, appClickListener as C } from "../../hooks/analytics.js";
+import { useRef as p, useMemo as b, useEffect as y } from "react";
+import { useStore as K } from "@streamlayer/react-polyfills";
 import { resetCss as c } from "../../ui/theme/theme.js";
 import { ActiveFeature as j, StandaloneFeature as R } from "./Features/index.js";
 import { SDKNavigation as w, SDKHeader as E } from "./Navigation/index.js";
@@ -21,7 +21,7 @@ const M = ({
   scrollNode: s,
   responsiveStore: t
 }) => {
-  const [, a] = x(e);
+  const [, a] = F(e);
   return /* @__PURE__ */ l(j, {
     className: n,
     scrollNode: s,
@@ -37,7 +37,7 @@ const M = ({
   appNode: r,
   responsiveStore: i
 }) => {
-  const s = N(e.featuresList.getStore());
+  const s = K(e.featuresList.getStore());
   return s ? Array.from(s, (t) => {
     const a = e.getFeature(t);
     return a ? /* @__PURE__ */ l(R, {
@@ -52,7 +52,7 @@ const M = ({
   sdk: e,
   topNavigation: n
 }) => {
-  const r = p(null), i = p(null), [s] = D(r), [t, a] = L(r, s), {
+  const r = p(null), i = p(null), [s] = x(r), [t, a] = D(r, s), {
     sdkReady: d,
     activeFeature: m,
     isLogged: S
@@ -60,27 +60,27 @@ const M = ({
   u(r, {
     enabled: o,
     event: "click",
-    listener: g
+    listener: L
   }), u(t, {
     enabled: o,
     event: "scrollend",
-    listener: C,
+    listener: g,
     useDomNode: !0
   }), u(t, {
     enabled: o,
     event: "click",
-    listener: b,
+    listener: C,
     useDomNode: !0
   });
-  const h = y(() => ({
+  const h = b(() => ({
     sdk: e,
     topNavigation: n
   }), [e, n]);
-  return K(() => {
+  return y(() => {
     import("./Features/Gamification/gamification-feature.js");
   }, []), /* @__PURE__ */ l(I.Provider, {
     value: h,
-    children: /* @__PURE__ */ f(A, {
+    children: /* @__PURE__ */ f(N, {
       ref: r,
       className: n ? "" : "c10llmat",
       children: [o && n && /* @__PURE__ */ l(w, {
@@ -91,7 +91,7 @@ const M = ({
         className: v(c, "sl-hide-on-modal"),
         sdk: e,
         ref: i
-      }), /* @__PURE__ */ f(F, {
+      }), /* @__PURE__ */ f(A, {
         className: "sl-hide-on-modal",
         ref: t,
         "data-nav": (!!m && o).toString(),

package/lib/app/app/story/index.d.ts

@@ -1,5 +1,4 @@
 import { DebugProps } from '../../../utils/debug';
 export declare const AppStory: React.FC<DebugProps & {
-    darkMode?: boolean;
     friendsTab?: 'enabled' | 'disabled' | 'activatedGame';
 }>;