fansunited-frontend-components 0.0.31-RC3 → 0.0.31-RC5

package/packages/classic-quiz-play/src/components/Variants/Standard/ScoreState/StandardScoreState.js

@@ -0,0 +1,220 @@
+import { j as e } from "../../../../../../../node_modules/react/jsx-runtime.js";
+import { Box as i, Typography as o, Button as z } from "@mui/joy";
+import { useInternalTheme as U, isMobile as O, useColors as r, useFontFamily as T, useCornerRadius as $, useBorderSize as G, useSpacingScale as J } from "../../../../../../common/src/functions/theme.js";
+import { hexToRgb as K } 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 A } from "../../../../../../common/src/enums/enums.js";
+import X from "../../../../../../common/src/components/AdditionalCTA.js";
+import "react";
+import "../../../../../../common/src/providers/ConstantsProvider.js";
+import Q from "../../../../../../common/src/components/Skeletons/Standard/ScoreState/StandardContentSkeleton.js";
+import Y from "../../../../../../../node_modules/@mui/icons-material/esm/Replay.js";
+import { useImageVariant as Z } from "../../../../../../common/src/hooks/useImageVariant.js";
+import "../../../../../../common/src/providers/ContainerProvider.js";
+import _ from "../../../../../../../node_modules/@mui/icons-material/esm/Share.js";
+import ee from "../../../Shared/MainCard.js";
+import te from "../../../Shared/ScoreStateWrapper.js";
+import p from "../../../Shared/PresentedBy.js";
+import { createStyles as se } from "./StandardScoreState.styles.js";
+import ae from "../../../Shared/AlertMessage.js";
+import { useScoreStateHelpers as ie } from "../../../../hooks/useScoreStateHelpers.js";
+import { useTranslation as ne } from "../../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
+const Be = (s) => {
+  var g, y, j, C, S;
+  const l = U(), m = Z(
+    {
+      images: s.classicQuiz.images,
+      imagePlaceholder: s.defaultImagePlaceholderUrl ? s.defaultImagePlaceholderUrl : ""
+    },
+    A.STANDARD
+  ), { t: n } = ne(), u = O(), a = ((g = s.classicQuiz.branding) == null ? void 0 : g.colors) || null, c = u ? ((y = s.classicQuiz.branding) == null ? void 0 : y.images.mobileLogo) || ((j = s.classicQuiz.branding) == null ? void 0 : j.images.mainLogo) || "" : ((C = s.classicQuiz.branding) == null ? void 0 : C.images.mainLogo) || "", x = s.imagePosition || "left", {
+    getHexagonBackground: P,
+    formatTime: B,
+    displayCongratulations: v,
+    getRandomEmoji: R,
+    shareResult: I
+  } = ie({
+    summary: s.summary,
+    totalTime: s.totalTime,
+    classicQuiz: s.classicQuiz,
+    variant: A.STANDARD
+  }), F = r().textPrimary, k = (a == null ? void 0 : a.primaryColor) || r().palette.primary.plainColor, W = (a == null ? void 0 : a.secondaryColor) || r().textSecondary, D = r().secondaryContainer, d = (a == null ? void 0 : a.contentColor) || r().textColor, L = T().secondary, M = T().primary, w = (a == null ? void 0 : a.backgroundColor) || r().surface, E = r().onSurface, q = $(), N = G().size, V = J(), H = `rgba(${K(
+    r().surfaceVariant || ""
+  )}, 0.5)`, t = se({
+    finalImage: m,
+    spacingScale: V,
+    borderRadius: q,
+    fontFamilyPrimary: M,
+    fontFamilySecondary: L,
+    textPrimary: F,
+    primaryColor: k,
+    secondaryColor: W,
+    secondaryContainer: D,
+    textColor: d,
+    bgcolor: w,
+    onSurfaceColor: E,
+    borderSize: N,
+    surfaceVariant: H,
+    imagePosition: x,
+    successColor: l.colorSchemes.light.palette.success.plainColor,
+    dangerColor: l.colorSchemes.light.palette.danger.plainColor,
+    onPrimaryColor: l.colorSchemes.light.palette.primary.onPrimary,
+    isMobile: u
+  }), h = () => {
+    var f, b;
+    return /* @__PURE__ */ e.jsx(i, { sx: t.mainContentArea, children: s.summary.classicQuizId ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      /* @__PURE__ */ e.jsx(i, { sx: t.contentWrapper, children: /* @__PURE__ */ e.jsx(i, { sx: t.contentScoreContainer, children: /* @__PURE__ */ e.jsx(i, { sx: t.scoreSection, children: /* @__PURE__ */ e.jsxs(i, { sx: t.scoreContentWrapper, children: [
+        /* @__PURE__ */ e.jsxs(i, { sx: t.achievementBadgeContainer, children: [
+          /* @__PURE__ */ e.jsx(
+            "img",
+            {
+              style: t.hexagonBackground,
+              src: P(),
+              alt: "achievement-badge-background"
+            }
+          ),
+          /* @__PURE__ */ e.jsx(
+            "img",
+            {
+              style: t.achievementEmoji,
+              src: R("light"),
+              alt: "achievement-badge"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ e.jsxs(i, { sx: t.textSection, children: [
+          /* @__PURE__ */ e.jsx(
+            o,
+            {
+              level: "body-lg",
+              sx: t.congratulationsText,
+              children: s.maxAttemptsReached ? n("classicQuiz.maxAttemptsReached") : v()
+            }
+          ),
+          /* @__PURE__ */ e.jsx(i, { sx: t.scoreContainer, children: /* @__PURE__ */ e.jsxs(i, { sx: t.scoreNumbersContainer, children: [
+            /* @__PURE__ */ e.jsx(
+              o,
+              {
+                level: "h2",
+                sx: t.correctScoreText(s.summary.correct),
+                children: s.summary.correct
+              }
+            ),
+            /* @__PURE__ */ e.jsxs(
+              o,
+              {
+                level: "h2",
+                sx: t.totalScoreText(s.summary.correct),
+                children: [
+                  "/",
+                  s.summary.classicQuizQuestions
+                ]
+              }
+            )
+          ] }) }),
+          s.classicQuiz.type && s.classicQuiz.type.toLocaleLowerCase() === "timed" ? /* @__PURE__ */ e.jsxs(o, { level: "body-md", sx: t.timeText, children: [
+            n("classicQuiz.youDidItFor"),
+            " ",
+            B()
+          ] }) : null,
+          s.classicQuiz.scored ? /* @__PURE__ */ e.jsxs(o, { level: "body-lg", sx: t.pointsText, children: [
+            n("classicQuiz.youWon"),
+            " ",
+            s.summary.correct * s.classicQuiz.points,
+            " ",
+            n("common.labels.points")
+          ] }) : null
+        ] })
+      ] }) }) }) }),
+      /* @__PURE__ */ e.jsx(i, { sx: t.ctaContainer, children: /* @__PURE__ */ e.jsxs(i, { sx: t.ctaContentWrapper, children: [
+        /* @__PURE__ */ e.jsx(o, { level: "body-lg", sx: t.thanksText, children: n("classicQuiz.thanksForPlaying") }),
+        /* @__PURE__ */ e.jsxs(i, { sx: t.buttonsContainer, children: [
+          s.maxAttemptsReached ? null : /* @__PURE__ */ e.jsx(
+            z,
+            {
+              sx: t.playAgainButton,
+              onClick: s.playAgain,
+              children: /* @__PURE__ */ e.jsxs(i, { sx: t.playAgainButtonContent, children: [
+                /* @__PURE__ */ e.jsx(Y, { sx: t.playAgainIcon }),
+                /* @__PURE__ */ e.jsx(o, { sx: t.playAgainText, children: n("classicQuiz.buttons.playAgain") })
+              ] })
+            }
+          ),
+          /* @__PURE__ */ e.jsx(z, { sx: t.shareButton, onClick: I, children: /* @__PURE__ */ e.jsxs(i, { sx: t.shareButtonContent, children: [
+            /* @__PURE__ */ e.jsx(_, { style: t.shareIcon }),
+            /* @__PURE__ */ e.jsx(o, { sx: t.shareText, children: n("classicQuiz.buttons.share") })
+          ] }) }),
+          /* @__PURE__ */ e.jsx(
+            X,
+            {
+              additionalCTA: s.additionalCTA,
+              buttonStyle: t.additionalCTAButton,
+              buttonContentStyle: t.additionalCTAButtonContent,
+              textStyle: t.additionalCTAText
+            }
+          )
+        ] }),
+        c ? /* @__PURE__ */ e.jsx(
+          p,
+          {
+            brandingLogo: c,
+            textColor: d,
+            label: ((f = s.classicQuiz.labels) == null ? void 0 : f.sponsor) || null,
+            isCentered: !0
+          }
+        ) : /* @__PURE__ */ e.jsx(e.Fragment, {})
+      ] }) })
+    ] }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      /* @__PURE__ */ e.jsx(
+        ae,
+        {
+          variant: "error",
+          title: n("common.authentication.accessRequired"),
+          message: n("common.authentication.invalidOrMissingAuth")
+        }
+      ),
+      c ? /* @__PURE__ */ e.jsx(
+        p,
+        {
+          brandingLogo: c,
+          textColor: d,
+          label: ((b = s.classicQuiz.labels) == null ? void 0 : b.sponsor) || null
+        }
+      ) : /* @__PURE__ */ e.jsx(e.Fragment, {})
+    ] }) });
+  };
+  return /* @__PURE__ */ e.jsx(ee, { brandingBorderColor: (a == null ? void 0 : a.borderColor) || null, children: s.showAnswerExplanations ? /* @__PURE__ */ e.jsx(
+    te,
+    {
+      questions: s.classicQuiz.questions,
+      userParticipation: s.summary.answers,
+      brandingColors: (S = s.classicQuiz.branding) == null ? void 0 : S.colors,
+      resultsTabPanelSxProps: {
+        display: "flex",
+        flexDirection: { xs: "column", md: "row" },
+        px: 0,
+        pb: 0,
+        pt: 0
+      },
+      children: /* @__PURE__ */ e.jsx(i, { sx: t.scoreStateWrapperContainer, children: /* @__PURE__ */ e.jsx(
+        Q,
+        {
+          finalImage: m,
+          imagePosition: x,
+          children: h()
+        }
+      ) })
+    }
+  ) : /* @__PURE__ */ e.jsx(
+    Q,
+    {
+      finalImage: m,
+      imagePosition: x,
+      children: h()
+    }
+  ) });
+};
+export {
+  Be as default
+};

package/packages/classic-quiz-play/src/components/Variants/Standard/ScoreState/StandardScoreState.styles.js

@@ -0,0 +1,347 @@
+const n = (e) => ({
+  // Main content area
+  mainContentArea: {
+    flex: e.isMobile ? "1" : e.finalImage ? "0.7" : "1",
+    display: "flex",
+    flexDirection: "column",
+    p: e.spacingScale.md,
+    gap: e.spacingScale.md
+  },
+  // Content wrapper
+  contentWrapper: {
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "center",
+    alignSelf: "stretch"
+  },
+  // Content score container
+  contentScoreContainer: {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    gap: e.spacingScale["3xl"],
+    alignSelf: "stretch"
+  },
+  // Score section
+  scoreSection: {
+    display: "flex",
+    gap: e.spacingScale.md,
+    py: e.spacingScale.xs,
+    justifyContent: "center",
+    alignSelf: "stretch",
+    alignItems: "center"
+  },
+  // Score content wrapper
+  scoreContentWrapper: {
+    display: "flex",
+    flexDirection: e.isMobile ? "column" : "row",
+    minWidth: "200px",
+    p: e.spacingScale.xs,
+    justifyContent: "center",
+    alignItems: "center",
+    gap: e.spacingScale.md,
+    flex: "1 0 0"
+  },
+  // Achievement badge container
+  achievementBadgeContainer: {
+    display: "flex",
+    width: e.isMobile ? "172px" : "auto",
+    height: e.isMobile ? "160px" : "auto",
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "center",
+    position: "relative"
+  },
+  // Hexagon background image
+  hexagonBackground: {
+    width: "160px",
+    height: "160px",
+    position: "absolute",
+    top: "55%",
+    left: "50%",
+    transform: "translate(-50%, -50%)"
+  },
+  // Achievement emoji
+  achievementEmoji: {
+    maxWidth: "80px",
+    maxHeight: "80px",
+    position: "relative"
+  },
+  // Text section
+  textSection: {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center"
+  },
+  // Congratulations text
+  congratulationsText: {
+    color: e.textPrimary,
+    textAlign: "center",
+    fontFamily: e.fontFamilyPrimary,
+    fontSize: "1.5em",
+    fontStyle: "normal",
+    fontWeight: 400,
+    lineHeight: "133.4%",
+    px: 2
+  },
+  // Score container
+  scoreContainer: {
+    display: "flex",
+    alignItems: "center",
+    gap: "4px"
+  },
+  // Score numbers container
+  scoreNumbersContainer: {
+    display: "flex",
+    alignItems: "flex-end",
+    gap: "4px"
+  },
+  // Correct score typography
+  correctScoreText: (t) => ({
+    textAlign: "center",
+    color: t > 0 ? e.successColor : e.dangerColor,
+    fontFamily: e.fontFamilyPrimary,
+    fontSize: "3.75em",
+    fontStyle: "normal",
+    fontWeight: 500,
+    lineHeight: "120%",
+    letterSpacing: "-0.5px"
+  }),
+  // Total score typography
+  totalScoreText: (t) => ({
+    textAlign: "center",
+    color: t > 0 ? e.successColor : e.dangerColor,
+    fontFamily: e.fontFamilyPrimary,
+    fontSize: "3.75em",
+    fontStyle: "normal",
+    fontWeight: 500,
+    lineHeight: "120%",
+    letterSpacing: "-0.5px"
+  }),
+  // Time text
+  timeText: {
+    textAlign: "center",
+    color: e.textPrimary,
+    fontFamily: e.fontFamilySecondary,
+    fontSize: "0.875em",
+    fontStyle: "normal",
+    fontWeight: 700,
+    lineHeight: "143%",
+    letterSpacing: "0.024px"
+  },
+  // Points text
+  pointsText: {
+    textAlign: "center",
+    color: e.textPrimary,
+    fontFamily: e.fontFamilyPrimary,
+    fontSize: "1.25em",
+    fontStyle: "normal",
+    fontWeight: 500,
+    lineHeight: "120%",
+    letterSpacing: "0.15px"
+  },
+  // Lead collection container
+  leadCollectionContainer: {
+    display: "flex",
+    flexDirection: "column",
+    p: e.spacingScale.md
+  },
+  // Lead question container
+  leadQuestionContainer: {
+    display: "flex",
+    flexDirection: "column",
+    gap: e.isMobile ? e.spacingScale.lg : e.spacingScale.md
+  },
+  // Lead content container
+  leadContentContainer: {
+    borderRadius: e.borderRadius.md,
+    px: e.spacingScale.md,
+    pt: e.spacingScale.md,
+    pb: e.spacingScale.lg,
+    gap: e.spacingScale.md,
+    bgcolor: e.surfaceVariant,
+    display: "flex",
+    flexDirection: "column",
+    backdropFilter: "blur(4px)"
+  },
+  // CTA container
+  ctaContainer: {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center"
+  },
+  // CTA content wrapper
+  ctaContentWrapper: {
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "center",
+    gap: e.spacingScale.lg
+  },
+  // Thanks for playing text
+  thanksText: {
+    color: e.textPrimary,
+    textAlign: "center",
+    fontFamily: e.fontFamilyPrimary,
+    fontSize: "1.25em",
+    fontStyle: "normal",
+    fontWeight: 500,
+    lineHeight: "120%",
+    letterSpacing: "0.15px"
+  },
+  // Buttons container
+  buttonsContainer: {
+    display: "flex",
+    flexDirection: e.isMobile ? "column" : "row",
+    gap: e.spacingScale.md
+  },
+  // Play again button
+  playAgainButton: {
+    display: "flex",
+    py: e.spacingScale.xs,
+    px: "16px",
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "center",
+    gap: "8px",
+    borderRadius: e.borderRadius.xl,
+    border: e.borderSize + " solid " + e.primaryColor,
+    bgcolor: e.bgcolor,
+    "&:hover": {
+      bgcolor: e.onSurfaceColor,
+      borderColor: e.primaryColor,
+      opacity: 0.9
+    },
+    fontSize: "0.8125em"
+  },
+  // Play again button content
+  playAgainButtonContent: {
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    gap: "8px",
+    alignSelf: "stretch"
+  },
+  // Play again icon
+  playAgainIcon: {
+    display: "flex",
+    width: "16px",
+    height: "16px",
+    justifyContent: "flex-end",
+    alignItems: "center",
+    color: e.textPrimary
+  },
+  // Play again text
+  playAgainText: {
+    color: e.textPrimary,
+    textAlign: "center",
+    fontFamily: e.fontFamilyPrimary,
+    fontSize: "0.8125em",
+    fontStyle: "normal",
+    fontWeight: 500,
+    lineHeight: "22px",
+    letterSpacing: "0.46px",
+    textTransform: "uppercase"
+  },
+  // Share button
+  shareButton: {
+    display: "flex",
+    py: e.spacingScale.xs,
+    px: "16px",
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "center",
+    gap: "10px",
+    borderRadius: e.borderRadius.xl,
+    bgcolor: e.primaryColor,
+    border: e.borderSize + " solid " + e.primaryColor,
+    "&:hover": {
+      bgcolor: e.primaryColor,
+      opacity: 0.9
+    },
+    fontSize: "0.8125em"
+  },
+  // Share button content
+  shareButtonContent: {
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    gap: "8px",
+    alignSelf: "stretch"
+  },
+  // Share icon
+  shareIcon: {
+    display: "flex",
+    width: "16px",
+    height: "16px",
+    justifyContent: "center",
+    alignItems: "center",
+    color: e.onPrimaryColor
+  },
+  // Share text
+  shareText: {
+    color: e.onPrimaryColor,
+    textAlign: "center",
+    fontFamily: e.fontFamilyPrimary,
+    fontSize: "0.8125em",
+    fontStyle: "normal",
+    fontWeight: 500,
+    lineHeight: "22px",
+    letterSpacing: "0.46px",
+    textTransform: "uppercase"
+  },
+  // Additional CTA button (secondary style)
+  additionalCTAButton: {
+    display: "flex",
+    py: e.spacingScale.sm,
+    px: e.spacingScale.md,
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "center",
+    gap: "8px",
+    borderRadius: e.borderRadius.xl,
+    border: e.borderSize + " solid " + e.secondaryContainer,
+    bgcolor: e.secondaryContainer,
+    "&:hover": {
+      bgcolor: e.secondaryContainer,
+      opacity: 0.9
+    },
+    fontSize: "0.8125em"
+  },
+  // Additional CTA button content
+  additionalCTAButtonContent: {
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    gap: "8px"
+  },
+  // Additional CTA text
+  additionalCTAText: {
+    color: e.secondaryColor,
+    fontFamily: e.fontFamilyPrimary,
+    fontSize: "0.8125em",
+    fontStyle: "normal",
+    fontWeight: 500,
+    lineHeight: "22px",
+    letterSpacing: "0.46px",
+    textTransform: "uppercase"
+  },
+  // Presented by container
+  presentedByContainer: {
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    gap: "8px",
+    alignSelf: "stretch"
+  },
+  // Score state wrapper container
+  scoreStateWrapperContainer: {
+    display: "flex",
+    flexDirection: e.isMobile ? "column" : "row",
+    width: "100%"
+  }
+});
+export {
+  n as createStyles
+};

package/packages/classic-quiz-play/src/components/Variants/Standard/SignIn/StandardSignIn.js

@@ -0,0 +1,117 @@
+import { j as t } from "../../../../../../../node_modules/react/jsx-runtime.js";
+import w from "../../../Shared/MainCard.js";
+import D from "../../../Shared/PresentedBy.js";
+import { isMobile as v, useInternalTheme as R, useFontFamily as F, useCornerRadius as _, useColors as a } from "../../../../../../common/src/functions/theme.js";
+import "../../../../../../../node_modules/i18next/dist/esm/i18next.js";
+import "../../../../../../../node_modules/i18next-browser-languagedetector/dist/esm/i18nextBrowserLanguageDetector.js";
+import { WidgetTemplate as M } from "../../../../../../common/src/enums/enums.js";
+import { Button as l, Typography as s, Box as U } from "@mui/joy";
+import "react";
+import "../../../../../../common/src/providers/ConstantsProvider.js";
+import E from "../../../../../../common/src/components/Skeletons/Standard/SignIn/StandardSignInSkeleton.js";
+import { useImageVariant as N } from "../../../../../../common/src/hooks/useImageVariant.js";
+import "../../../../../../common/src/providers/ContainerProvider.js";
+import { createStyles as V } from "./StandardSignIn.styles.js";
+import { useTranslation as W } from "../../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
+const sn = (n) => {
+  var c, u, g, d, I;
+  const e = ((c = n.classicQuiz.branding) == null ? void 0 : c.colors) || null, r = v(), j = R(), m = N(
+    {
+      images: n.classicQuiz.images,
+      imagePlaceholder: n.defaultImagePlaceholderUrl ? n.defaultImagePlaceholderUrl : ""
+    },
+    M.STANDARD
+  ), b = F().primary, B = _().xl, P = (e == null ? void 0 : e.primaryColor) || a().palette.primary.plainColor, S = a().palette.primary.onPrimary, k = (e == null ? void 0 : e.contentColor) || a().textColor, z = r ? ((u = n.classicQuiz.branding) == null ? void 0 : u.images.mobileLogo) || ((g = n.classicQuiz.branding) == null ? void 0 : g.images.mainLogo) || "" : ((d = n.classicQuiz.branding) == null ? void 0 : d.images.mainLogo) || "", { t: o } = W(), L = n.imagePosition || "left", i = V({
+    fontFamilyPrimary: b,
+    buttonRadius: B,
+    primaryColor: P,
+    onPrimaryColor: S
+  }), Q = () => {
+    var x, f, C, T;
+    return n.signInCTA ? (x = n.signInCTA) != null && x.component ? n.signInCTA.component : (f = n.signInCTA) != null && f.onClick ? /* @__PURE__ */ t.jsx(
+      l,
+      {
+        variant: "soft",
+        sx: {
+          ...i.signInButton,
+          ...i.pulseAnimation
+        },
+        onClick: n.signInCTA.onClick,
+        children: /* @__PURE__ */ t.jsx(s, { sx: i.signInButtonText, children: n.signInCTA.defaultLabel || o("common.signIn") })
+      }
+    ) : (C = n.signInCTA) != null && C.url ? typeof window > "u" ? /* @__PURE__ */ t.jsx(
+      U,
+      {
+        component: "a",
+        href: n.signInCTA.url,
+        target: ((T = n.signInCTA) == null ? void 0 : T.target) || "_self",
+        sx: {
+          ...i.signInButton,
+          ...i.pulseAnimation,
+          textDecoration: "none",
+          display: "inline-flex",
+          alignItems: "center",
+          justifyContent: "center"
+        },
+        children: /* @__PURE__ */ t.jsx(s, { sx: i.signInButtonText, children: n.signInCTA.defaultLabel || o("common.signIn") })
+      }
+    ) : /* @__PURE__ */ t.jsx(
+      l,
+      {
+        variant: "soft",
+        sx: {
+          ...i.signInButton,
+          ...i.pulseAnimation
+        },
+        onClick: () => {
+          var h, y, A;
+          ((h = n.signInCTA) == null ? void 0 : h.target) === "_blank" ? window.open((y = n.signInCTA) == null ? void 0 : y.url, "_blank") : window.location.href = (A = n.signInCTA) == null ? void 0 : A.url;
+        },
+        children: /* @__PURE__ */ t.jsx(s, { sx: i.signInButtonText, children: n.signInCTA.defaultLabel || o("common.signIn") })
+      }
+    ) : /* @__PURE__ */ t.jsx(
+      l,
+      {
+        variant: "soft",
+        sx: {
+          ...i.signInButton
+        },
+        disabled: !0,
+        children: /* @__PURE__ */ t.jsx(s, { sx: i.signInButtonText, children: n.signInCTA.defaultLabel || o("common.signIn") })
+      }
+    ) : /* @__PURE__ */ t.jsx(
+      l,
+      {
+        variant: "soft",
+        sx: {
+          ...i.signInButton
+        },
+        disabled: !0,
+        children: /* @__PURE__ */ t.jsx(s, { sx: i.signInButtonText, children: o("common.signIn") })
+      }
+    );
+  };
+  return /* @__PURE__ */ t.jsx(w, { brandingBorderColor: (e == null ? void 0 : e.borderColor) || null, children: /* @__PURE__ */ t.jsx(
+    E,
+    {
+      entity: n.classicQuiz,
+      headline: o("classicQuiz.headline"),
+      finalImage: m,
+      imagePosition: L,
+      signInContent: Q(),
+      brandingContent: /* @__PURE__ */ t.jsx(
+        D,
+        {
+          brandingLogo: z,
+          textColor: r && m ? (e == null ? void 0 : e.contentColor) || j.colorSchemes.dark.textColor : k,
+          label: ((I = n.classicQuiz.labels) == null ? void 0 : I.sponsor) || null,
+          isCentered: !0
+        }
+      ),
+      rulesDisplay: n.rulesDisplay
+    }
+  ) });
+};
+export {
+  sn as default
+};