fansunited-frontend-components 0.0.31-RC5 → 0.0.31-RC7

package/packages/event-game-play/src/components/Variants/Overlay/ScoreState/EventGameOverlayScoreState.js

@@ -1,141 +0,0 @@
-import { j as t } from "../../../../../../../node_modules/react/jsx-runtime.js";
-import { Box as a } from "@mui/joy";
-import { useInternalTheme as k, useSpacingScale as R, isMobile as B, useImageBackgroundGradient as E } from "../../../../../../common/src/functions/theme.js";
-import { sanitizeBackgroundUrl as G } from "../../../../../../common/src/functions/helpers.js";
-import "../../../../../../../node_modules/i18next/dist/esm/i18next.js";
-import "../../../../../../../node_modules/i18next-browser-languagedetector/dist/esm/i18nextBrowserLanguageDetector.js";
-import { WidgetTemplate as y } from "../../../../../../common/src/enums/enums.js";
-import f from "../../../../../../common/src/components/AdditionalCTA.js";
-import "react";
-import "../../../../../../common/src/providers/ConstantsProvider.js";
-import F from "../../../../../../common/src/components/Skeletons/Overlay/ScoreState/OverlayScoreStateSkeleton.js";
-import { useImageVariant as O } from "../../../../../../common/src/hooks/useImageVariant.js";
-import "../../../../../../common/src/providers/ContainerProvider.js";
-import U from "../../../../assets/default-quiz-bg.png.js";
-import V from "../../../../assets/default-quiz-bg-vertical.jpg.js";
-import { createStyles as M } from "./EventGameOverlayScoreState.styles.js";
-import W from "../../../Shared/AlertMessage.js";
-import w from "../../../Shared/Summary/PredictionSummary.js";
-import { useTranslation as z } from "../../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
-const ie = (e) => {
-  const n = k(), o = R(), { t: i } = z(), r = B(), g = E(
-    y.OVERLAY
-  ), h = e.defaultImagePlaceholderUrl ? e.defaultImagePlaceholderUrl : r ? V : U, S = O(
-    {
-      images: e.eventGame.images,
-      imagePlaceholder: h
-    },
-    y.OVERLAY
-  ), p = G(S), C = n.colorSchemes.dark.textSecondary, s = n.colorSchemes.dark.secondaryContainer, j = n.colorSchemes.dark.textPrimary, c = n.customFontFamily.light.primary, P = n.customRadius.light.md, m = n.customRadius.light.xl, b = n.colorSchemes.dark.surfaceVariant, v = e.eventGame.status === "OPEN" && e.prediction && e.onPredictionUpdate, T = (I) => {
-    console.log(`Edit prediction for fixture at index: ${I}`);
-  }, l = M({
-    spacingScale: o,
-    textPrimary: j,
-    fontFamilyPrimary: c,
-    mdBorderRadius: P,
-    xlBorderRadius: m,
-    contentBgColor: b,
-    onSurfaceColor: n.colorSchemes.dark.onSurface,
-    surfaceVariantColor: n.colorSchemes.dark.surfaceVariant
-  }), d = {
-    display: "flex",
-    py: r ? o.xs : o.sm,
-    px: r ? o.sm : o.md,
-    flexDirection: "row",
-    justifyContent: "center",
-    alignItems: "center",
-    gap: "8px",
-    borderRadius: m,
-    bgcolor: s,
-    "&:hover": {
-      bgcolor: s,
-      opacity: 0.9
-    },
-    fontSize: r ? "0.750em" : "0.8125em",
-    fontWeight: 500,
-    textTransform: "uppercase"
-  }, u = {
-    display: "flex",
-    justifyContent: "center",
-    alignItems: "center",
-    gap: "8px"
-  }, x = {
-    color: C,
-    fontFamily: c,
-    fontStyle: "normal",
-    lineHeight: "24px",
-    letterSpacing: "0.40px",
-    textTransform: "uppercase"
-  }, A = () => /* @__PURE__ */ t.jsxs(a, { sx: l.mainContentWrapper, children: [
-    e.isUnauthorized ? /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsx(
-      W,
-      {
-        variant: "error",
-        title: i("common.authentication.accessRequired"),
-        message: i("common.authentication.invalidOrMissingAuth")
-      }
-    ) }) : /* @__PURE__ */ t.jsx(a, { sx: l.resultsContainer, children: /* @__PURE__ */ t.jsx(a, { sx: l.resultsWrapper, children: v ? /* @__PURE__ */ t.jsx(
-      w,
-      {
-        fixtures: e.eventGame.fixtures,
-        prediction: e.prediction,
-        onEditPrediction: T,
-        onPredictionUpdate: e.onPredictionUpdate,
-        play: e.play,
-        view: "score",
-        isOverlayVariant: !0,
-        onPlayResult: e.onPlayResult
-      }
-    ) : null }) }),
-    r ? /* @__PURE__ */ t.jsx(t.Fragment, { children: e.additionalCTA && /* @__PURE__ */ t.jsx(
-      a,
-      {
-        sx: {
-          display: "flex",
-          justifyContent: "center",
-          alignItems: "center"
-        },
-        children: /* @__PURE__ */ t.jsx(
-          f,
-          {
-            additionalCTA: e.additionalCTA,
-            buttonStyle: d,
-            buttonContentStyle: u,
-            textStyle: x
-          }
-        )
-      }
-    ) }) : /* @__PURE__ */ t.jsx(t.Fragment, { children: e.additionalCTA && /* @__PURE__ */ t.jsx(
-      a,
-      {
-        sx: {
-          display: "flex",
-          justifyContent: "flex-end"
-        },
-        children: /* @__PURE__ */ t.jsx(
-          f,
-          {
-            additionalCTA: e.additionalCTA,
-            buttonStyle: d,
-            buttonContentStyle: u,
-            textStyle: x
-          }
-        )
-      }
-    ) })
-  ] });
-  return /* @__PURE__ */ t.jsx(
-    F,
-    {
-      entity: { ...e.eventGame, labels: null },
-      headline: i("eventGame.headline"),
-      backgroundImage: p,
-      imageBackgroundGradient: g,
-      rulesDisplay: e.rulesDisplay,
-      children: A()
-    }
-  );
-};
-export {
-  ie as default
-};

package/packages/event-game-play/src/components/Variants/Overlay/ScoreState/EventGameOverlayScoreState.styles.js

@@ -1,156 +0,0 @@
-const t = (e) => ({
-  // Main content wrapper
-  mainContentWrapper: {
-    display: "flex",
-    flexDirection: "column",
-    gap: "24px",
-    zIndex: 10
-  },
-  resultsContainer: {
-    borderRadius: e.mdBorderRadius,
-    p: e.spacingScale.md,
-    display: "flex",
-    flexDirection: "column",
-    alignItems: "center",
-    alignSelf: "stretch",
-    gap: e.spacingScale.md,
-    backdropFilter: "blur(4px)",
-    position: "relative",
-    "&::before": {
-      content: '""',
-      position: "absolute",
-      top: 0,
-      left: 0,
-      right: 0,
-      bottom: 0,
-      backgroundColor: e.contentBgColor,
-      opacity: 0.25,
-      borderRadius: "inherit",
-      zIndex: 0,
-      backdropFilter: "blur(4px)"
-    },
-    "& > *": {
-      position: "relative",
-      zIndex: 1
-    }
-  },
-  resultsWrapper: {
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "center",
-    alignItems: "center",
-    alignSelf: "stretch"
-  },
-  ctaSection: {
-    borderRadius: e.mdBorderRadius,
-    py: e.spacingScale.md,
-    display: "flex",
-    flexDirection: "column",
-    alignItems: "center",
-    alignSelf: "stretch",
-    gap: e.spacingScale.md,
-    backdropFilter: "blur(4px)",
-    position: "relative",
-    "&::before": {
-      content: '""',
-      position: "absolute",
-      top: 0,
-      left: 0,
-      right: 0,
-      bottom: 0,
-      backgroundColor: e.contentBgColor,
-      opacity: 0.25,
-      borderRadius: "inherit",
-      zIndex: 0,
-      backdropFilter: "blur(4px)"
-    },
-    "& > *": {
-      position: "relative",
-      zIndex: 1
-    }
-  },
-  // Buttons container
-  buttonsContainer: {
-    display: "flex",
-    flexDirection: "column",
-    gap: e.spacingScale.md
-  },
-  // Play again button
-  playAgainButton: {
-    display: "flex",
-    minHeight: "48px",
-    py: "12px",
-    pr: "24px",
-    pl: "16px",
-    flexDirection: "column",
-    justifyContent: "center",
-    alignItems: "center",
-    gap: "8px",
-    borderRadius: e.xlBorderRadius,
-    bgcolor: e.onSurfaceColor,
-    "&:hover": {
-      bgcolor: e.surfaceVariantColor
-    },
-    fontSize: "0.9375em"
-  },
-  // Play again button content
-  playAgainButtonContent: {
-    display: "flex",
-    justifyContent: "center",
-    alignItems: "center",
-    gap: "8px",
-    alignSelf: "stretch"
-  },
-  // Play again icon
-  playAgainIcon: {
-    display: "flex",
-    width: "24px",
-    height: "24px",
-    justifyContent: "center",
-    alignItems: "center",
-    color: e.textPrimary
-  },
-  // Play again text
-  playAgainText: {
-    color: e.textPrimary,
-    textAlign: "center",
-    fontFamily: e.fontFamilyPrimary,
-    fontSize: "0.9375em",
-    fontStyle: "normal",
-    fontWeight: 500,
-    lineHeight: "24px",
-    letterSpacing: "0.46px",
-    textTransform: "uppercase"
-  },
-  // Lead collection container
-  leadCollectionContainer: {
-    borderRadius: e.mdBorderRadius,
-    p: e.spacingScale.md,
-    display: "flex",
-    flexDirection: "column",
-    alignSelf: "stretch",
-    gap: e.spacingScale.md,
-    backdropFilter: "blur(4px)",
-    position: "relative",
-    "&::before": {
-      content: '""',
-      position: "absolute",
-      top: 0,
-      left: 0,
-      right: 0,
-      bottom: 0,
-      backgroundColor: e.contentBgColor,
-      opacity: 0.25,
-      borderRadius: "inherit",
-      zIndex: 0,
-      backdropFilter: "blur(4px)"
-    },
-    "& > *": {
-      position: "relative",
-      zIndex: 1
-    }
-  }
-});
-export {
-  t as createStyles
-};

package/packages/event-game-play/src/components/Variants/Split/Error/EventGameSplitError.js

@@ -1,28 +0,0 @@
-import { j as e } from "../../../../../../../node_modules/react/jsx-runtime.js";
-import "react";
-import "../../../../../../common/src/providers/ContainerProvider.js";
-import "../../../../../../../node_modules/i18next/dist/esm/i18next.js";
-import "../../../../../../../node_modules/i18next-browser-languagedetector/dist/esm/i18nextBrowserLanguageDetector.js";
-import "@mui/joy";
-import "../../../../../../common/src/providers/ConstantsProvider.js";
-import o from "../../../../../../common/src/components/Skeletons/Split/ApiError/SplitApiErrorSkeleton.js";
-import i from "../../../Shared/MainCard.js";
-import { useTranslation as n } from "../../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
-const y = (r) => {
-  const { t } = n();
-  return /* @__PURE__ */ e.jsx(i, { brandingBorderColor: null, children: /* @__PURE__ */ e.jsx(
-    o,
-    {
-      entity: { ...r.eventGame, labels: null },
-      headline: t("eventGame.headline"),
-      tryAgainButtonText: t("eventGame.buttons.tryAgain"),
-      defaultImagePlaceholderUrl: r.defaultImagePlaceholderUrl,
-      isApiError: r.isApiError,
-      toggleTryAgain: r.toggleTryAgain,
-      renderPresentedBy: (a) => /* @__PURE__ */ e.jsx(e.Fragment, {})
-    }
-  ) });
-};
-export {
-  y as default
-};

package/packages/event-game-play/src/components/Variants/Split/EventGameSplitVariant.js

@@ -1,347 +0,0 @@
-import { j as e } from "../../../../../../node_modules/react/jsx-runtime.js";
-import re, { useCallback as oe, useMemo as U } from "react";
-import { Box as o, Typography as u, Button as k } from "@mui/joy";
-import { isMobile as se, useColors as v, useFontFamily as ae, useCornerRadius as w, useSpacingScale as ce } from "../../../../../common/src/functions/theme.js";
-import { hexToRgb as le } from "../../../../../common/src/functions/helpers.js";
-import "../../../../../../node_modules/i18next/dist/esm/i18next.js";
-import "../../../../../../node_modules/i18next-browser-languagedetector/dist/esm/i18nextBrowserLanguageDetector.js";
-import { WidgetTemplate as de } from "../../../../../common/src/enums/enums.js";
-import "../../../../../common/src/providers/ConstantsProvider.js";
-import me from "../../../../../common/src/components/Skeletons/Split/SplitSkeleton.js";
-import { useImageVariant as ue } from "../../../../../common/src/hooks/useImageVariant.js";
-import "../../../../../common/src/providers/ContainerProvider.js";
-import xe from "../../Shared/MainCard.js";
-import fe from "../../../assets/default-quiz-bg.png.js";
-import pe from "../../../assets/default-quiz-bg-vertical.jpg.js";
-import { createStyles as ge } from "./EventGameSplitVariant.styles.js";
-import { EventGameOutcomeTypeEnum as f } from "fansunited-sdk-esm";
-import he from "../../Shared/Fixtures/Number/NumberFixture.js";
-import Ce from "../../Shared/Fixtures/Boolean/BooleanFixture.js";
-import L from "../../Shared/Fixtures/Text/TextFixture.js";
-import ve from "../../Shared/Stepper.js";
-import ye from "../../Shared/Countdown.js";
-import Se from "../../Shared/Summary/PredictionSummary.js";
-import { isPredictionsCutoffPassed as je, clampNumberPrediction as be } from "../../../helpers/helpers.js";
-import { useTranslation as Ge } from "../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
-const Qe = (n) => {
-  const [r, E] = re.useState(1), { t: c } = Ge(), O = se(), M = n.defaultImagePlaceholderUrl ? n.defaultImagePlaceholderUrl : O ? pe : fe, D = ue(
-    {
-      images: n.eventGame.images,
-      imagePlaceholder: M
-    },
-    de.SPLIT
-  ), $ = v().palette.danger.plainColor, z = v().textColor, A = v().textColor, T = ae().primary, _ = v().surfaceVariant, W = w(), p = v().palette.primary.plainColor, g = v().palette.primary.onPrimary, N = w().xl, q = ce(), i = ge({
-    spacingScale: q,
-    borderRadius: W,
-    fontFamilyPrimary: T,
-    bgcolor: le(_ || ""),
-    textColor: z,
-    secondaryColor: A,
-    isMobile: O,
-    dangerColor: $
-  }), I = oe(
-    (t, s) => {
-      n.setPrediction((d) => {
-        const m = { ...d }, l = m.fixtures.find(
-          (x) => x.id === t
-        );
-        return l && (l.prediction = s), m;
-      });
-    },
-    [n.setPrediction]
-  ), h = n.eventGame.fixtures.length + 1, y = n.eventGame.status === "OPEN" && je(n.eventGame.predictionsCutoff || ""), H = () => {
-    var s, d;
-    const t = n.eventGame.fixtures[r - 1];
-    if (t && t.outcomeType === f.NUMBER) {
-      const m = t.validOutcomes, l = (d = (s = n.prediction) == null ? void 0 : s.fixtures) == null ? void 0 : d.find(
-        (x) => x.id === t.id
-      );
-      if (l && typeof l.prediction == "number") {
-        const x = be(
-          l.prediction,
-          m
-        );
-        x !== l.prediction && I(t.id, x);
-      }
-    }
-    r < h ? E(r + 1) : n.play();
-  }, J = (t) => {
-    E(t + 1);
-  }, F = () => {
-    var d, m;
-    if (r === h) return !0;
-    const t = n.eventGame.fixtures[r - 1];
-    if (!t) return !1;
-    const s = (m = (d = n.prediction) == null ? void 0 : d.fixtures) == null ? void 0 : m.find(
-      (l) => l.id === t.id
-    );
-    if (!s) return !1;
-    switch (t.outcomeType) {
-      case f.BOOLEAN:
-        return typeof s.prediction == "boolean";
-      case f.NUMBER:
-        return typeof s.prediction == "number";
-      case f.FREE_INPUT:
-        return typeof s.prediction == "string" && s.prediction.trim().length > 0;
-      case f.ENUM:
-        return typeof s.prediction == "string" && s.prediction.trim().length > 0;
-      default:
-        return !1;
-    }
-  }, K = () => {
-    r > 1 && E(r - 1);
-  }, Q = () => /* @__PURE__ */ e.jsx(o, { sx: i.questionAreaContent, children: /* @__PURE__ */ e.jsx(o, { sx: i.mainContentContainer, children: /* @__PURE__ */ e.jsxs(o, { sx: i.gameStateContainer, children: [
-    /* @__PURE__ */ e.jsx(u, { sx: i.stateTitle, children: c("eventGame.states.pending.title") }),
-    /* @__PURE__ */ e.jsx(u, { sx: i.stateDescription, children: c("eventGame.states.pending.description") })
-  ] }) }) }), X = () => /* @__PURE__ */ e.jsx(o, { sx: i.questionAreaContent, children: /* @__PURE__ */ e.jsx(o, { sx: i.mainContentContainer, children: /* @__PURE__ */ e.jsxs(o, { sx: i.gameStateContainer, children: [
-    /* @__PURE__ */ e.jsxs(o, { sx: i.liveIndicatorContainer, children: [
-      /* @__PURE__ */ e.jsx(o, { sx: i.liveIndicator }),
-      /* @__PURE__ */ e.jsx(u, { sx: i.liveText, children: c("eventGame.states.live.indicator") })
-    ] }),
-    /* @__PURE__ */ e.jsx(u, { sx: i.stateDescription, children: c("eventGame.states.live.description") })
-  ] }) }) }), Y = () => /* @__PURE__ */ e.jsx(o, { sx: i.questionAreaContent, children: /* @__PURE__ */ e.jsx(o, { sx: i.mainContentContainer, children: /* @__PURE__ */ e.jsxs(o, { sx: i.gameStateContainer, children: [
-    /* @__PURE__ */ e.jsx(u, { sx: i.stateTitle, children: c("eventGame.states.closed.title") }),
-    /* @__PURE__ */ e.jsx(u, { sx: i.stateDescription, children: c("eventGame.states.closed.description") })
-  ] }) }) }), Z = () => /* @__PURE__ */ e.jsxs(o, { sx: i.gameStateContainer, children: [
-    /* @__PURE__ */ e.jsx(u, { sx: i.stateTitle, children: c("eventGame.states.open.title") }),
-    /* @__PURE__ */ e.jsx(u, { sx: i.stateDescription, children: c("eventGame.states.open.description") })
-  ] }), C = U(() => n.eventGame.fixtures[r - 1], [n.eventGame.fixtures, r]), S = U(() => C ? {
-    onSelectionChange: (t) => I(C.id, t)
-  } : {}, [C == null ? void 0 : C.id, I]), ee = () => {
-    var s, d, m, l, x, B, R, V;
-    const t = C;
-    if (y)
-      return Z();
-    if (t)
-      switch (t.outcomeType) {
-        case f.NUMBER:
-          const j = (d = (s = n.prediction) == null ? void 0 : s.fixtures) == null ? void 0 : d.find(
-            (a) => a.id === t.id
-          ), ie = t.validOutcomes;
-          return /* @__PURE__ */ e.jsx(
-            he,
-            {
-              prediction: typeof (j == null ? void 0 : j.prediction) == "number" ? j.prediction : 0,
-              isSplitVariant: !0,
-              onChange: (a) => S.onSelectionChange(a),
-              question: t.question,
-              validOutcomes: ie || null,
-              fixtureId: t.id
-            },
-            `${t.id}-${r}`
-          );
-        case f.BOOLEAN:
-          const b = (l = (m = n.prediction) == null ? void 0 : m.fixtures) == null ? void 0 : l.find(
-            (a) => a.id === t.id
-          );
-          return /* @__PURE__ */ e.jsx(
-            Ce,
-            {
-              prediction: typeof (b == null ? void 0 : b.prediction) == "boolean" ? b.prediction : null,
-              isSplitVariant: !0,
-              onSelectionChange: S.onSelectionChange,
-              question: t.question,
-              fixtureId: t.id
-            },
-            t.id
-          );
-        case f.FREE_INPUT:
-          const G = (B = (x = n.prediction) == null ? void 0 : x.fixtures) == null ? void 0 : B.find(
-            (a) => a.id === t.id
-          );
-          return /* @__PURE__ */ e.jsx(
-            L,
-            {
-              question: t.question,
-              prediction: typeof (G == null ? void 0 : G.prediction) == "string" ? G.prediction : null,
-              validOutcomes: null,
-              onTextChange: (a) => S.onSelectionChange(a),
-              isSplitVariant: !0,
-              fixtureId: t.id
-            },
-            `${t.id}-${r}`
-          );
-        case f.ENUM:
-          const P = (V = (R = n.prediction) == null ? void 0 : R.fixtures) == null ? void 0 : V.find(
-            (a) => a.id === t.id
-          );
-          return /* @__PURE__ */ e.jsx(
-            L,
-            {
-              question: t.question,
-              prediction: typeof (P == null ? void 0 : P.prediction) == "string" ? P.prediction : null,
-              validOutcomes: t.validOutcomes,
-              onTextChange: (a) => S.onSelectionChange(a),
-              isSplitVariant: !0,
-              fixtureId: t.id,
-              optionsLayout: n.optionsLayout
-            },
-            `${t.id}-${r}`
-          );
-      }
-  }, te = () => /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    n.showCountdown && !y && n.eventGame.status === "OPEN" && /* @__PURE__ */ e.jsx(
-      o,
-      {
-        sx: {
-          my: q.lg
-        },
-        children: /* @__PURE__ */ e.jsx(
-          ye,
-          {
-            predictionsCutoffTime: n.eventGame.predictionsCutoff || "",
-            isSplitVariant: !0
-          }
-        )
-      }
-    ),
-    !y && /* @__PURE__ */ e.jsx(o, { sx: i.paginationContainer, children: /* @__PURE__ */ e.jsx(
-      ve,
-      {
-        eventGame: n.eventGame,
-        currentStep: r,
-        totalSteps: h,
-        isSplitVariant: !0
-      }
-    ) }),
-    /* @__PURE__ */ e.jsx(o, { sx: i.questionAreaContent, children: /* @__PURE__ */ e.jsxs(o, { sx: i.mainContentContainer, children: [
-      r === h ? /* @__PURE__ */ e.jsx(
-        Se,
-        {
-          fixtures: n.eventGame.fixtures,
-          prediction: n.prediction,
-          onEditPrediction: J,
-          onPredictionUpdate: n.setPrediction,
-          view: "play",
-          play: async () => n.play(),
-          isSplitVariant: !0
-        }
-      ) : ee(),
-      /* @__PURE__ */ e.jsxs(o, { sx: i.navigationContainer, children: [
-        r > 1 && r < h && /* @__PURE__ */ e.jsx(
-          k,
-          {
-            variant: "outlined",
-            onClick: K,
-            sx: {
-              borderRadius: N,
-              py: "10px",
-              px: "16px",
-              borderColor: p,
-              color: g,
-              transition: "all 300ms cubic-bezier(0.2, 0, 0, 1)",
-              transform: "scale(1)",
-              alignSelf: "center",
-              "&:hover": {
-                borderColor: p,
-                backgroundColor: `${p}10`,
-                transform: "scale(1.02)"
-              },
-              "&:active": {
-                transform: "scale(0.98)"
-              },
-              fontSize: "0.9375em"
-            },
-            children: /* @__PURE__ */ e.jsx(
-              u,
-              {
-                sx: {
-                  fontFamily: T,
-                  fontWeight: 500,
-                  fontSize: "0.9375em",
-                  lineHeight: "24px",
-                  letterSpacing: "0.46px",
-                  textTransform: "uppercase",
-                  gap: "8px",
-                  display: "flex",
-                  alignItems: "center"
-                },
-                children: c("eventGame.buttons.back")
-              }
-            )
-          }
-        ),
-        !y && /* @__PURE__ */ e.jsx(
-          k,
-          {
-            variant: "soft",
-            onClick: F() ? H : () => {
-            },
-            loading: n.isPlaying,
-            sx: {
-              cursor: F() ? "pointer" : "not-allowed",
-              opacity: F() ? "1" : "0.5",
-              borderRadius: N,
-              py: "10px",
-              px: "16px",
-              bgcolor: p,
-              color: g,
-              transition: "all 300ms cubic-bezier(0.2, 0, 0, 1)",
-              transform: "scale(1)",
-              alignSelf: "center",
-              "&:hover": {
-                bgcolor: p,
-                transform: "scale(1.02)"
-              },
-              "&:active": {
-                color: g,
-                transform: "scale(0.98)"
-              },
-              "&:disabled": {
-                bgcolor: p,
-                color: g,
-                opacity: "12%"
-              },
-              "--Icon-color": g,
-              fontSize: "0.9375em"
-            },
-            children: /* @__PURE__ */ e.jsx(
-              u,
-              {
-                sx: {
-                  fontFamily: T,
-                  fontWeight: 500,
-                  fontSize: "0.9375em",
-                  lineHeight: "24px",
-                  letterSpacing: "0.46px",
-                  textTransform: "uppercase",
-                  color: g,
-                  gap: "8px",
-                  display: "flex",
-                  alignItems: "center"
-                },
-                children: c(r === h ? "eventGame.buttons.play" : "eventGame.buttons.next")
-              }
-            )
-          }
-        )
-      ] })
-    ] }) })
-  ] }), ne = () => {
-    switch (n.eventGame.status) {
-      case "PENDING":
-        return Q();
-      case "LIVE":
-        return X();
-      case "CLOSED":
-        return Y();
-      default:
-        return te();
-    }
-  };
-  return /* @__PURE__ */ e.jsx(xe, { brandingBorderColor: null, children: /* @__PURE__ */ e.jsx(
-    me,
-    {
-      entity: { ...n.eventGame, labels: null },
-      headline: c("eventGame.headline"),
-      finalImage: D,
-      brandingLogo: "",
-      renderPresentedBy: (t) => /* @__PURE__ */ e.jsx(e.Fragment, {}),
-      rulesDisplay: n.rulesDisplay,
-      children: ne()
-    }
-  ) });
-};
-export {
-  Qe as default
-};