@streamlayer/react-ui 1.22.0 → 1.22.2

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

@@ -1,41 +1,45 @@
-import { jsxs as k, Fragment as b, jsx as u } from "react/jsx-runtime";
+import { jsxs as w, Fragment as b, jsx as u } from "react/jsx-runtime";
 import { cx as V } from "@linaria/core";
 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-DALxy-8N.js";
+import { useState as k, useMemo as D, useEffect as h, useRef as E, useCallback as I } from "react";
+import { r as q } from "../../../index-DALxy-8N.js";
 import { useStore as y } from "@streamlayer/react-polyfills";
-import { eventBus as q } from "@streamlayer/sdk-web-interfaces";
+import { eventBus as R } from "@streamlayer/sdk-web-interfaces";
 import { NotificationType as p } from "@streamlayer/sdk-web-notifications";
-import { QuestionTypeData as C } from "../../../ui/gamification/constants.js";
+import { QuestionTypeData as A } from "../../../ui/gamification/constants.js";
 import { Notification as N } from "../../../ui/gamification/question/notification/index.js";
-import { PredictionResult as x } from "../../../ui/gamification/question/notification/prediction-result/index.js";
-import { Onboarding as P } from "./Onboarding/index.js";
-import { HiddenContainer as z, Container as A, InnerContainer as B, NotificationRefreshing as H, Pill as S } from "./styles.js";
-const v = (r) => {
-  const [e, d] = I(0), i = E(null), l = D(() => new ResizeObserver((o) => {
-    var h;
-    for (const c of o)
-      if (c.contentBoxSize) {
-        const n = (h = i.current) == null ? void 0 : h.getBoundingClientRect();
-        n && d(n.height);
+import { PredictionResult as C } from "../../../ui/gamification/question/notification/prediction-result/index.js";
+import { Onboarding as x } from "./Onboarding/index.js";
+import { HiddenContainer as P, Container as z, InnerContainer as B, NotificationRefreshing as H, Pill as S } from "./styles.js";
+const v = (n) => {
+  const [e, d] = k(0), i = E(null), l = D(() => new ResizeObserver((o) => {
+    window.requestAnimationFrame(() => {
+      var f;
+      if (Array.isArray(o)) {
+        for (const c of o)
+          if (c.contentBoxSize) {
+            const r = (f = i.current) == null ? void 0 : f.getBoundingClientRect();
+            r && d(r.height);
+          }
       }
-  }), []), s = w((o) => {
+    });
+  }), []), s = I((o) => {
     i.current = o;
-  }, []), f = w((o) => {
+  }, []), a = I((o) => {
     d(o);
   }, []);
-  return a(() => {
+  return h(() => {
     const o = i.current;
     return o ? (l.observe(o), () => {
       l.unobserve(o);
     }) : () => {
     };
-  }, [r]), a(() => () => {
+  }, [n]), h(() => () => {
     l.disconnect();
-  }), [s, e, f];
+  }), [s, e, a];
 }, Q = ({
-  sdk: r,
+  sdk: n,
   notification: e,
   appNode: d,
   responsiveStore: i,
@@ -47,18 +51,18 @@ const v = (r) => {
   } = y(i, {
     keys: ["sdkInDesktopView"]
   }), {
-    sdk: f
-  } = O(), [o, h, c] = v(e.id);
-  let n = h;
-  return l || (n = "auto"), e.type === p.QUESTION ? /* @__PURE__ */ k(b, {
-    children: [/* @__PURE__ */ u(z, {
+    sdk: a
+  } = O(), [o, f, c] = v(e.id);
+  let r = f;
+  return l || (r = "auto"), e.type === p.QUESTION ? /* @__PURE__ */ w(b, {
+    children: [/* @__PURE__ */ u(P, {
       ref: o,
       children: /* @__PURE__ */ u(N, {
         ...e
       })
-    }), /* @__PURE__ */ k(A, {
+    }), /* @__PURE__ */ w(z, {
       style: {
-        height: e.hiding ? 0 : n
+        height: e.hiding ? 0 : r
       },
       hiding: e.hiding,
       children: [/* @__PURE__ */ u(B, {
@@ -67,37 +71,37 @@ const v = (r) => {
         },
         children: /* @__PURE__ */ u(N, {
           ...e,
-          controlVideo: f == null ? void 0 : f.controlVideoPlayer
+          controlVideo: a == null ? void 0 : a.controlVideoPlayer
         })
       }), /* @__PURE__ */ u(H, {}, e.id)]
     })]
-  }) : e.type === p.QUESTION_RESOLVED && ((m = (t = e.data) == null ? void 0 : t.question) != null && m.predictionResult) ? /* @__PURE__ */ u(x, {
+  }) : e.type === p.QUESTION_RESOLVED && ((m = (t = e.data) == null ? void 0 : t.question) != null && m.predictionResult) ? /* @__PURE__ */ u(C, {
     style: {
-      height: e.hiding ? 0 : h
+      height: e.hiding ? 0 : f
     },
     saveHeight: c,
     close: e.close,
     hiding: e.hiding,
     ...e.data.question
-  }) : e.type === p.ONBOARDING ? /* @__PURE__ */ u(P, {
+  }) : e.type === p.ONBOARDING ? /* @__PURE__ */ u(x, {
     style: {
-      height: e.hiding ? 0 : n
+      height: e.hiding ? 0 : r
     },
     saveHeight: c,
-    sdk: r,
+    sdk: n,
     notification: e,
     sdkInDesktopView: s,
     appNode: d,
     responsiveStore: i
   }) : null;
-}, U = "p7vfi6t", j = ({
-  pill: r,
+}, F = "p7vfi6t", U = ({
+  pill: n,
   setPill: e,
   appNode: d,
   headerNode: i,
   scrollNode: l,
   responsiveStore: s,
-  scrollStore: f
+  scrollStore: a
 }) => {
   var t, m;
   const {
@@ -105,17 +109,17 @@ const v = (r) => {
   } = y(s, {
     keys: ["screen"]
   }), {
-    tabsShown: h,
+    tabsShown: f,
     scrollPosition: c
-  } = y(f, {
+  } = y(a, {
     keys: ["tabsShown", "scrollPosition"]
   });
-  a(() => {
+  h(() => {
     s.get().sdkInDesktopView ? c < 50 && e(null) : c > -50 && e(null);
   }, [c, s, e]);
-  const n = s.get().sdkInDesktopView ? d : i;
-  return !r || !n.current ? null : R.createPortal(/* @__PURE__ */ u(S, {
-    title: r.type === p.QUESTION_RESOLVED ? "Prediction result" : `New ${((m = C[(t = r.data) == null ? void 0 : t.questionType]) == null ? void 0 : m.label) || "notification"}`,
+  const r = s.get().sdkInDesktopView ? d : i;
+  return !n || !r.current ? null : q.createPortal(/* @__PURE__ */ u(S, {
+    title: n.type === p.QUESTION_RESOLVED ? "Prediction result" : `New ${((m = A[(t = n.data) == null ? void 0 : t.questionType]) == null ? void 0 : m.label) || "notification"}`,
     onClick: () => {
       var g;
       s.get().sdkInDesktopView ? (g = l.current) == null || g.scrollTo({
@@ -125,46 +129,46 @@ const v = (r) => {
         behavior: "smooth"
       }), e(null);
     },
-    className: V(h && U, "sl-pill-button")
-  }), n.current);
+    className: V(f && F, "sl-pill-button")
+  }), r.current);
 }, oe = ({
-  sdk: r,
+  sdk: n,
   headerNode: e,
   scrollNode: d,
   responsiveStore: i,
   appNode: l,
   scrollStore: s,
-  hasActiveFeature: f
+  hasActiveFeature: a
 }) => {
-  const [o] = I(r.getNotificationsStore()), h = y(o), [c, n] = I(null), t = D(() => r.getActiveNotification(), [r, h]);
-  return a(() => {
-    t && q.emit("notification", {
+  const [o] = k(n.getNotificationsStore()), f = y(o), [c, r] = k(null), t = D(() => n.getActiveNotification(), [n, f]);
+  return h(() => {
+    t && R.emit("notification", {
       action: "rendered",
       payload: {
         questionId: t.data.questionId,
         questionType: t.data.questionType
       }
     });
-  }, [t]), a(() => {
+  }, [t]), h(() => {
     const {
       sdkInDesktopView: m,
       sdkInView: g
     } = i.get();
-    t && (m || g) && (!m && g && n(t), m && window.requestAnimationFrame(() => {
-      s.get().scrollPosition !== 0 && n(t);
+    t && (m || g) && (!m && g && r(t), m && window.requestAnimationFrame(() => {
+      s.get().scrollPosition !== 0 && r(t);
     }));
-  }, [t]), a(() => {
-    t || n(null);
-  }, [t]), /* @__PURE__ */ k(b, {
+  }, [t]), h(() => {
+    t || r(null);
+  }, [t]), /* @__PURE__ */ w(b, {
     children: [!c && t && /* @__PURE__ */ u(Q, {
       appNode: l,
-      sdk: r,
-      hasActiveFeature: f,
+      sdk: n,
+      hasActiveFeature: a,
       notification: t,
       responsiveStore: i
-    }), c && /* @__PURE__ */ u(j, {
+    }), c && /* @__PURE__ */ u(U, {
       pill: c,
-      setPill: n,
+      setPill: r,
       appNode: l,
       notification: t,
       headerNode: e,

package/lib/app/masters/BetPack/BetPackContent/EmergencyScreen/index.d.ts

@@ -1,6 +1,7 @@
+import { BetPackEventCb } from '../..';
 export declare const EmergencyScreen: React.FC<{
     actionFn: () => void;
     description: string;
-    isMobile?: boolean;
-    height?: number;
+    className?: string;
+    onEvent: BetPackEventCb;
 }>;

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

@@ -1,15 +1,13 @@
-import { jsxs as m, jsx as e } from "react/jsx-runtime";
-import { cx as s } from "@linaria/core";
-import { useDynamicParentFont as a } from "../ScreenContainer/useDynamicParentFont.js";
-import { EmergencyContainer as l, EmergencyScreenTitle as g, EmergencyScreenDescription as y, EmergencyScreenButton as f } from "./styles.js";
-const d = ({ actionFn: n, description: r, isMobile: c, height: o }) => {
-  const { container: t, fontSize: i } = a(o);
-  return /* @__PURE__ */ m(l, { style: { fontSize: i }, ref: t, className: s("betPack", !!c && "isMobile"), children: [
-    /* @__PURE__ */ e(g, { children: "Something went wrong." }),
-    /* @__PURE__ */ e(y, { children: r }),
-    /* @__PURE__ */ e(f, { onClick: n, children: "Try again" })
-  ] });
-};
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { useEffect as o } from "react";
+import { EmergencyContainer as m, EmergencyScreenTitle as g, EmergencyScreenDescription as y, EmergencyScreenButton as l } from "./styles.js";
+const d = ({ actionFn: n, description: c, className: t, onEvent: r }) => (o(() => {
+  r({ type: "slBetPackReady" });
+}, [r]), /* @__PURE__ */ i(m, { className: t, children: [
+  /* @__PURE__ */ e(g, { children: "Something went wrong." }),
+  /* @__PURE__ */ e(y, { children: c }),
+  /* @__PURE__ */ e(l, { onClick: n, children: "Try again" })
+] }));
 export {
   d as EmergencyScreen
 };

package/lib/app/masters/BetPack/BetPackContent/EmergencyScreen/styles.d.ts

@@ -1,4 +1,8 @@
 export declare const EmergencyContainer: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
 export declare const EmergencyScreenTitle: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
 export declare const EmergencyScreenDescription: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
-export declare const EmergencyScreenButton: any;
+export declare const EmergencyScreenButton: {
+    __wyw_meta: unknown;
+} & import('react').FunctionComponent<import('react').ClassAttributes<HTMLButtonElement> & import('react').ButtonHTMLAttributes<HTMLButtonElement> & Record<never, unknown> & {
+    as?: React.ElementType;
+}>;

package/lib/app/masters/BetPack/BetPackContent/EmergencyScreen/styles.js

@@ -1,5 +1,5 @@
 import { styled as e } from "@linaria/react";
-import { ScreenButton as n } from "../../styles.js";
+import { ScreenButton as n } from "../styles.js";
 const o = /* @__PURE__ */ e("div")({
   name: "EmergencyContainer",
   class: "e1f9mu2m",

package/lib/app/masters/BetPack/BetPackContent/EndScreen/index.d.ts

@@ -1,5 +1,5 @@
 import { BetPackEventCb } from '../..';
 export declare const EndScreen: React.FC<{
-    height: number | undefined;
     onEvent: BetPackEventCb;
+    height?: number;
 }>;

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

@@ -1,46 +1,38 @@
 import { jsx as e, jsxs as n } from "react/jsx-runtime";
-import { useState as a } from "react";
-import { ScreenContainer as c } from "../ScreenContainer/index.js";
-import { ScreenWrap as i, EndFirstScreenWrap as p, EndScreenMain as t, SponsorIcon as m, EndScreenTitle as h, EndScreenDescription as S, EndScreenButton as d, EndLastScreenWrap as u, EndScreenMedia as E, EndLastScreenDescription as b } from "./styles.js";
-const x = ({ height: r, onEvent: o }) => {
-  const [s, l] = a(
+import { useState as l } from "react";
+import { ScreenContainer as t } from "../ScreenContainer/index.js";
+import { ScreenWrap as i, ScreenTextBlock as m, ScreenTitle as p, ScreenDescription as c, ScreenButton as o } from "../styles.js";
+import { EndScreenSponsorIcon as h, EndScreenMedia as S } from "./styles.js";
+const E = ({ onEvent: s, height: r }) => {
+  const [d, a] = l(
     0
     /* FIRST */
   );
-  return s === 0 ? /* @__PURE__ */ e(c, { height: r, children: /* @__PURE__ */ e(i, { children: /* @__PURE__ */ n(p, { children: [
-    /* @__PURE__ */ n(t, { children: [
-      /* @__PURE__ */ e(m, { name: "icon-masters-logo" }),
-      /* @__PURE__ */ e(h, { children: "Great picks!" }),
-      /* @__PURE__ */ n(S, { children: [
-        "As results come in we’ll send you",
-        /* @__PURE__ */ e("br", {}),
-        "live updates right here."
-      ] })
+  return d === 0 ? /* @__PURE__ */ e(t, { height: r, children: /* @__PURE__ */ n(i, { children: [
+    /* @__PURE__ */ e(h, {}),
+    /* @__PURE__ */ n(m, { children: [
+      /* @__PURE__ */ e(p, { children: "Great picks!" }),
+      /* @__PURE__ */ e(c, { children: "Stay in the Enhanced Stream for live results, predictions, trivia, polls, and match insights." })
     ] }),
     /* @__PURE__ */ e(
-      d,
+      o,
       {
         onClick: () => {
-          l(
+          a(
             1
             /* LAST */
           );
         },
+        style: { marginTop: "auto " },
         children: "Continue"
       }
     )
-  ] }) }) }, "end") : /* @__PURE__ */ e(c, { height: r, children: /* @__PURE__ */ e(i, { children: /* @__PURE__ */ n(u, { children: [
-    /* @__PURE__ */ n(t, { children: [
-      /* @__PURE__ */ e(E, { src: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/bet_pack_end_screen.png" }),
-      /* @__PURE__ */ n(b, { children: [
-        "Look for more live match insights,",
-        /* @__PURE__ */ e("br", {}),
-        "predictions and more."
-      ] })
-    ] }),
-    /* @__PURE__ */ e(d, { onClick: () => o({ type: "slOpenGameCenter" }), children: "Open Game Center" })
-  ] }) }) }, "end");
+  ] }) }, "end") : /* @__PURE__ */ e(t, { height: r, children: /* @__PURE__ */ n(i, { children: [
+    /* @__PURE__ */ e(S, { src: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/bet_pack_end_screen.png" }),
+    /* @__PURE__ */ e(c, { children: "Look for more live match insights, predictions and more." }),
+    /* @__PURE__ */ e(o, { onClick: () => s({ type: "slOpenGameCenter" }), children: "Open Game Center" })
+  ] }) }, "end");
 };
 export {
-  x as EndScreen
+  E as EndScreen
 };

package/lib/app/masters/BetPack/BetPackContent/EndScreen/styles.d.ts

@@ -1,19 +1,7 @@
-export declare const ScreenWrap: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
-export declare const SponsorIcon: any;
-export declare const EndScreenWrap: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
-export declare const EndFirstScreenWrap: {
-    __wyw_meta: unknown;
-} & import('react').FunctionComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown> & {
-    as?: React.ElementType;
-}>;
-export declare const EndLastScreenWrap: {
+export declare const EndScreenMedia: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLImageElement> & import('react').ImgHTMLAttributes<HTMLImageElement> & Record<never, unknown>>;
+export declare const EndScreenSponsorIcon: {
     __wyw_meta: unknown;
-} & import('react').FunctionComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown> & {
-    as?: React.ElementType;
+} & import('react').FC<{
+    style?: React.CSSProperties;
+    className?: string;
 }>;
-export declare const EndScreenMain: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
-export declare const EndScreenTitle: any;
-export declare const EndScreenDescription: any;
-export declare const EndLastScreenDescription: any;
-export declare const EndScreenButton: any;
-export declare const EndScreenMedia: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLImageElement> & import('react').ImgHTMLAttributes<HTMLImageElement> & Record<never, unknown>>;

package/lib/app/masters/BetPack/BetPackContent/EndScreen/styles.js

@@ -1,61 +1,15 @@
-import { styled as e } from "@linaria/react";
-import { ScreenTitle as r, ScreenDescription as s, ScreenButton as c } from "../../styles.js";
-import { SvgIcon as o } from "../../../../../ui/icons/index.js";
-const u = /* @__PURE__ */ e("div")({
-  name: "ScreenWrap",
-  class: "s8s3kc9",
-  propsAsIs: !1
-}), t = () => o, A = /* @__PURE__ */ e(t())({
-  name: "SponsorIcon",
-  class: "s1uswib2",
-  propsAsIs: !0
-}), n = /* @__PURE__ */ e("div")({
-  name: "EndScreenWrap",
-  class: "el0dbzn",
-  propsAsIs: !1
-}), p = () => n, x = /* @__PURE__ */ e(p())({
-  name: "EndFirstScreenWrap",
-  class: "e11do4i1",
-  propsAsIs: !0
-}), a = () => n, f = /* @__PURE__ */ e(a())({
-  name: "EndLastScreenWrap",
-  class: "ef67yx9",
-  propsAsIs: !0
-}), W = /* @__PURE__ */ e("div")({
-  name: "EndScreenMain",
-  class: "enw6fxs",
-  propsAsIs: !1
-}), i = () => r, _ = /* @__PURE__ */ e(i())({
-  name: "EndScreenTitle",
-  class: "euaws9b",
-  propsAsIs: !0
-}), d = () => s, v = /* @__PURE__ */ e(d())({
-  name: "EndScreenDescription",
-  class: "e9uqaot",
-  propsAsIs: !0
-}), S = () => s, D = /* @__PURE__ */ e(S())({
-  name: "EndLastScreenDescription",
-  class: "etyeg2m",
-  propsAsIs: !0
-}), l = () => c, L = /* @__PURE__ */ e(l())({
-  name: "EndScreenButton",
-  class: "e177v9in",
-  propsAsIs: !0
-}), M = /* @__PURE__ */ e("img")({
+import { styled as s } from "@linaria/react";
+import { SponsorIcon as e } from "../styles.js";
+const c = /* @__PURE__ */ s("img")({
   name: "EndScreenMedia",
-  class: "ehp7lor",
+  class: "e8s3kc9",
   propsAsIs: !1
+}), n = () => e, p = /* @__PURE__ */ s(n())({
+  name: "EndScreenSponsorIcon",
+  class: "e1uswib2",
+  propsAsIs: !0
 });
 export {
-  x as EndFirstScreenWrap,
-  D as EndLastScreenDescription,
-  f as EndLastScreenWrap,
-  L as EndScreenButton,
-  v as EndScreenDescription,
-  W as EndScreenMain,
-  M as EndScreenMedia,
-  _ as EndScreenTitle,
-  n as EndScreenWrap,
-  u as ScreenWrap,
-  A as SponsorIcon
+  c as EndScreenMedia,
+  p as EndScreenSponsorIcon
 };

package/lib/app/masters/BetPack/BetPackContent/LoaderScreen/index.d.ts

@@ -1 +1,3 @@
-export declare const LoaderScreen: () => import("react/jsx-runtime").JSX.Element;
+export declare const LoaderScreen: React.FC<{
+    className?: string;
+}>;

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

@@ -1,13 +1,16 @@
 import { jsx as o } from "react/jsx-runtime";
-import { styled as r } from "@linaria/react";
-import { Loader as e } from "../../../../../ui/loader/index.js";
-const t = /* @__PURE__ */ r("div")({
+import { styled as e } from "@linaria/react";
+import { Loader as t } from "../../../../../ui/loader/index.js";
+const s = /* @__PURE__ */ e("div")({
   name: "Container",
   class: "cv31tt7",
   propsAsIs: !1
-}), i = () => /* @__PURE__ */ o(t, {
-  children: /* @__PURE__ */ o(e, {})
+}), m = ({
+  className: r
+}) => /* @__PURE__ */ o(s, {
+  className: r,
+  children: /* @__PURE__ */ o(t, {})
 });
 export {
-  i as LoaderScreen
+  m as LoaderScreen
 };

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

@@ -1,10 +1,6 @@
-import { jsx as n } from "react/jsx-runtime";
-import { ScreenContainerBox as i } from "./styles.js";
-import { useDynamicParentFont as c } from "./useDynamicParentFont.js";
-const s = ({ children: o, height: r }) => {
-  const { container: e, fontSize: t } = c(r);
-  return /* @__PURE__ */ n(i, { style: { height: r, fontSize: t }, ref: e, children: /* @__PURE__ */ n("div", { children: o }) });
-};
+import { jsx as e } from "react/jsx-runtime";
+import { ScreenContainerBox as o } from "./styles.js";
+const i = ({ children: n, height: r }) => /* @__PURE__ */ e(o, { className: "ScreenContainer", children: /* @__PURE__ */ e("div", { style: r ? { height: r } : {}, children: n }) });
 export {
-  s as ScreenContainer
+  i as ScreenContainer
 };

package/lib/app/masters/BetPack/BetPackContent/StartScreen/index.d.ts

@@ -1,5 +1,4 @@
-export declare const StartScreen: React.FC<{
-    height: number | undefined;
+export declare const StartScreen: import('react').ForwardRefExoticComponent<{
     countQuestionsAvailable: number;
     sliderRef: React.MutableRefObject<null>;
-}>;
+} & import('react').RefAttributes<HTMLDivElement>>;

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

@@ -1,36 +1,30 @@
 import { jsx as e, jsxs as r } from "react/jsx-runtime";
-import { ScreenContainer as a } from "../ScreenContainer/index.js";
-import { ScreenWrap as c, Main as s, SponsorIcon as l, StartScreenSponsor as S, StartScreenTitle as h, StartScreenDescription as d, StartScreenButton as p, IconArrowRight as m, StartScreenNote as f } from "./styles.js";
-const x = ({ height: o, countQuestionsAvailable: t, sliderRef: i }) => /* @__PURE__ */ e(a, { height: o, children: /* @__PURE__ */ r(c, { children: [
-  /* @__PURE__ */ r(s, { children: [
-    /* @__PURE__ */ e(l, { name: "icon-masters-logo" }),
-    /* @__PURE__ */ e(S, { children: "Featured Groups+" }),
-    /* @__PURE__ */ e(h, { children: "The First Five" }),
-    /* @__PURE__ */ r(d, { children: [
-      "Tee off with these five initial",
-      /* @__PURE__ */ e("br", {}),
-      "predictions for today’s play."
-    ] })
+import { forwardRef as c } from "react";
+import { ScreenContainer as s } from "../ScreenContainer/index.js";
+import { ScreenWrap as l, SponsorIcon as a, ScreenTextBlock as S, ScreenTitle as h, ScreenDescription as d, ScreenButton as m } from "../styles.js";
+import { StartScreenSponsor as p, NextButton as f, IconArrowRight as x, StartScreenNote as u } from "./styles.js";
+const N = c(({ countQuestionsAvailable: o, sliderRef: n }, i) => /* @__PURE__ */ e(s, { children: /* @__PURE__ */ r(l, { ref: i, children: [
+  /* @__PURE__ */ e(a, {}),
+  /* @__PURE__ */ r(S, { children: [
+    /* @__PURE__ */ e(p, { children: "FEATURED GROUPS+" }),
+    /* @__PURE__ */ e(h, { children: "The First Five" })
   ] }),
+  /* @__PURE__ */ e(d, { children: "Tee off with these five initial predictions for today’s play." }),
   /* @__PURE__ */ r(
-    p,
+    m,
     {
       onClick: () => {
-        var n;
-        (n = i.current) == null || n.slickNext();
+        var t;
+        (t = n.current) == null || t.slickNext();
       },
       children: [
-        t ? `${t} questions available` : "See all questions",
-        /* @__PURE__ */ e(m, { name: "iconArrowRight" })
+        o ? `${o} questions available` : "See all questions",
+        /* @__PURE__ */ e(f, { children: /* @__PURE__ */ e(x, { name: "iconArrowRight" }) })
       ]
     }
   ),
-  /* @__PURE__ */ r(f, { children: [
-    "Note: Some questions may have been",
-    /* @__PURE__ */ e("br", {}),
-    "resolved as a result of today’s play."
-  ] })
-] }) }, "start");
+  /* @__PURE__ */ e(u, { children: "Note: Some questions may have been resolved as a result of today’s play." })
+] }) }, "start"));
 export {
-  x as StartScreen
+  N as StartScreen
 };

package/lib/app/masters/BetPack/BetPackContent/StartScreen/styles.d.ts

@@ -1,9 +1,4 @@
-export declare const ScreenWrap: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
-export declare const Main: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const NextButton: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLSpanElement> & import('react').HTMLAttributes<HTMLSpanElement> & Record<never, unknown>>;
 export declare const IconArrowRight: any;
-export declare const SponsorIcon: any;
 export declare const StartScreenSponsor: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
-export declare const StartScreenTitle: any;
-export declare const StartScreenDescription: any;
-export declare const StartScreenButton: any;
 export declare const StartScreenNote: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;