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

package/packages/classic-quiz-play/src/assets/sports_score.svg.js

@@ -0,0 +1,4 @@
+const H = "data:image/svg+xml,%3csvg%20width='25'%20height='24'%20viewBox='0%200%2025%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cmask%20id='mask0_929_504'%20style='mask-type:alpha'%20maskUnits='userSpaceOnUse'%20x='0'%20y='0'%20width='25'%20height='24'%3e%3crect%20x='0.5'%20width='24'%20height='24'%20fill='%23D9D9D9'/%3e%3c/mask%3e%3cg%20mask='url(%23mask0_929_504)'%3e%3cpath%20d='M9.6875%206H11.5625V4.125H9.6875V6ZM13.4375%206V4.125H15.3125V6H13.4375ZM9.6875%2013.5V11.625H11.5625V13.5H9.6875ZM17.1875%209.75V7.875H19.0625V9.75H17.1875ZM17.1875%2013.5V11.625H19.0625V13.5H17.1875ZM13.4375%2013.5V11.625H15.3125V13.5H13.4375ZM17.1875%206V4.125H19.0625V6H17.1875ZM11.5625%207.875V6H13.4375V7.875H11.5625ZM5.9375%2019.825V4.125H7.8125V6H9.6875V7.875H7.8125V9.75H9.6875V11.625H7.8125V19.825H5.9375ZM15.3125%2011.625V9.75H17.1875V11.625H15.3125ZM11.5625%2011.625V9.75H13.4375V11.625H11.5625ZM9.6875%209.75V7.875H11.5625V9.75H9.6875ZM13.4375%209.75V7.875H15.3125V9.75H13.4375ZM15.3125%207.875V6H17.1875V7.875H15.3125Z'%20fill='%23212121'/%3e%3c/g%3e%3c/svg%3e";
+export {
+  H as default
+};

package/packages/classic-quiz-play/src/components/ClassicQuizNotFound.js

@@ -0,0 +1,23 @@
+import { j as t } 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 i from "../../../common/src/components/Skeletons/NotFoundSkeleton.js";
+import r from "./Shared/MainCard.js";
+import { useTranslation as n } from "../../../../node_modules/react-i18next/dist/es/useTranslation.js";
+const f = () => {
+  const { t: o } = n();
+  return /* @__PURE__ */ t.jsx(r, { brandingBorderColor: null, children: /* @__PURE__ */ t.jsx(
+    i,
+    {
+      notFoundTitle: o("classicQuiz.quizNotFound"),
+      notFoundMessage: o("classicQuiz.quizNotFoundDescription")
+    }
+  ) });
+};
+export {
+  f as default
+};

package/packages/classic-quiz-play/src/components/ClassicQuizPlay.js

@@ -0,0 +1,353 @@
+import { j as i } from "../../../../node_modules/react/jsx-runtime.js";
+import { useState as n, useMemo as te, useEffect as W } from "react";
+import { WidgetTemplate as y } from "../../../common/src/enums/enums.js";
+import "../../../common/src/providers/ContainerProvider.js";
+import { initializeI18n as ae } from "../../../common/src/functions/i18n.js";
+import ie from "../../../common/src/components/Spinner.js";
+import "@mui/joy";
+import "../../../common/src/providers/ConstantsProvider.js";
+import { useClassicQuizById as le } from "../hooks/useClassicQuizById.js";
+import { useMyParticipation as se } from "../hooks/useMyParticipation.js";
+import { ClassicQuizUserParticipationModel as J } from "fansunited-sdk-esm";
+import ne from "./Variants/Overlay/OverlayVariant.js";
+import re from "./Variants/Standard/StandardVariant.js";
+import oe from "./Variants/Split/SplitVariant.js";
+import ue from "./Variants/Standard/ScoreState/StandardScoreState.js";
+import de from "./Variants/Split/ScoreState/SplitScoreState.js";
+import me from "./Variants/Overlay/ScoreState/OverlayScoreState.js";
+import { quizTypes as ce } from "../constants/constants.js";
+import fe from "./ClassicQuizNotFound.js";
+import ge from "./Variants/Standard/Error/StandardError.js";
+import ye from "./Variants/Split/Error/SplitError.js";
+import Ie from "./Variants/Overlay/Error/OverlayError.js";
+import he from "./Variants/Standard/SignIn/StandardSignIn.js";
+import Pe from "./Variants/Split/SignIn/SplitSignIn.js";
+import Ce from "./Variants/Overlay/SignIn/OverlaySignIn.js";
+import Se from "./Variants/Standard/LeadCollection/StandardLeadAfterCollection.js";
+import Ae from "./Variants/Split/LeadCollection/SplitLeadAfterCollection.js";
+import we from "./Variants/Overlay/LeadCollection/OverlayLeadAfterCollection.js";
+function D(e) {
+  return e.template === y.STANDARD;
+}
+const pe = (e) => {
+  var H;
+  const [s, I] = n(1), [h, U] = n(null), [E, P] = n(!1), [j, Q] = n([]), [Y, d] = n(
+    []
+  ), [m, r] = n(!1), [X, R] = n(!1), [Z, L] = n(!1), [x, B] = n(!1), [z, T] = n(!0), [c, u] = n(0), [N, _] = n(!1), t = le(e.entityId, e.sdk), {
+    myParticipation: f,
+    isUnauthorized: $,
+    isApiError: k,
+    setIsUnauthorized: C,
+    setIsApiError: S
+  } = se(e.entityId, e.sdk, N), A = te(() => {
+    var l;
+    if (!t || !f || !((l = f[0]) != null && l.classicQuizId) || t.maxAttempts === 0 || t.maxAttempts === null)
+      return !1;
+    const a = f[0];
+    return (t == null ? void 0 : t.maxAttempts) <= (a == null ? void 0 : a.attempts);
+  }, [t, f]);
+  if (W(() => {
+    ae(e.language || "en");
+  }, [e.language]), W(() => {
+    var a;
+    t && t.type && (!(t.authRequirement === "LEAD" && ((a = e.leads) == null ? void 0 : a.position) === "before") && ce.includes(t.type.toLocaleLowerCase()) && B(!0), t.type.toLowerCase() === "countdown" && u(t.time || 10));
+  }, [t]), !t || !f)
+    return /* @__PURE__ */ i.jsx(ie, { my: 20 });
+  if (!t.id)
+    return /* @__PURE__ */ i.jsx(fe, {});
+  if (t.authRequirement === "REGISTERED" && !e.userIsLoggedIn)
+    return D(e) ? /* @__PURE__ */ i.jsx(
+      he,
+      {
+        classicQuiz: t,
+        imagePosition: e.imagePosition,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        signInCTA: e.signInCTA,
+        rulesDisplay: e.rulesDisplay
+      }
+    ) : e.template === y.OVERLAY ? /* @__PURE__ */ i.jsx(
+      Ce,
+      {
+        classicQuiz: t,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        signInCTA: e.signInCTA,
+        rulesDisplay: e.rulesDisplay
+      }
+    ) : /* @__PURE__ */ i.jsx(
+      Pe,
+      {
+        classicQuiz: t,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        signInCTA: e.signInCTA,
+        rulesDisplay: e.rulesDisplay
+      }
+    );
+  const O = () => {
+    S(!1), C(!1), d([]), I(1), U(null), P(!1), Q([]), T(!0), r(!1), R(!1), L(!1), t.type && t.type.toLowerCase() === "countdown" ? u(t.time || 10) : u(0), _(!N);
+  };
+  if ($ || k)
+    return D(e) ? /* @__PURE__ */ i.jsx(
+      ge,
+      {
+        classicQuiz: t,
+        imagePosition: e.imagePosition,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        isApiError: k,
+        toggleTryAgain: O,
+        rulesDisplay: e.rulesDisplay
+      }
+    ) : e.template === y.OVERLAY ? /* @__PURE__ */ i.jsx(
+      Ie,
+      {
+        classicQuiz: t,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        isApiError: k,
+        toggleTryAgain: O,
+        rulesDisplay: e.rulesDisplay
+      }
+    ) : /* @__PURE__ */ i.jsx(
+      ye,
+      {
+        classicQuiz: t,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        isApiError: k,
+        toggleTryAgain: O,
+        rulesDisplay: e.rulesDisplay
+      }
+    );
+  const q = async () => {
+    var o;
+    const a = t.questions[s - 1];
+    let l = null;
+    h && (l = a.options[h - 1].optionId), P(!0), T(!1);
+    const G = [
+      ...j,
+      {
+        questionId: a.questionId,
+        optionId: l
+      }
+    ];
+    if (Q(G), s === t.questionsCount) {
+      if (((o = e.leads) == null ? void 0 : o.position) === "after" && t.authRequirement === "LEAD" && !X) {
+        L(!0), setTimeout(() => {
+          I((g) => g + 1), P(!1);
+        }, 1500);
+        return;
+      }
+      r(!0);
+      try {
+        await e.sdk.miniGames.participateInClassicQuiz(
+          e.entityId,
+          G
+        );
+      } catch (g) {
+        if (d([new J()]), e.sdk.helpers.getSDKConfiguration().errorHandlingMode === "standard") {
+          const w = g;
+          w.error.code === 401 || w.error.code === 403 ? C(!0) : S(!0);
+        } else {
+          const w = g;
+          w.data.error.code === 401 || w.data.error.code === 403 ? C(!0) : S(!0);
+        }
+        r(!1);
+        return;
+      }
+      const ee = await e.sdk.miniGames.getMyClassicQuizParticipations({
+        classicQuizIds: [e.entityId]
+      });
+      d(ee), setTimeout(() => {
+        I((g) => g + 1), r(!1);
+      }, 1500);
+    } else
+      setTimeout(() => {
+        I((K) => K + 1), U(null), P(!1), t.type && t.type.toLowerCase() === "countdown" && u(t.time || 10), T(!0);
+      }, 1500);
+  }, b = (a) => {
+    U(a);
+  }, V = (a) => {
+    u(a), t.type && t.type.toLocaleLowerCase() === "countdown" && a === 0 && !x && q();
+  }, M = () => {
+    I(1), U(null), P(!1), Q([]), d([]), T(!0), r(!1), R(!1), L(!1), t.type && t.type.toLowerCase() === "countdown" ? u(t.time || 10) : u(0);
+  }, v = () => {
+    B(!1);
+  }, F = async () => {
+    R(!0), r(!0);
+    try {
+      await e.sdk.miniGames.participateInClassicQuiz(
+        e.entityId,
+        j
+      );
+    } catch (l) {
+      if (d([new J()]), e.sdk.helpers.getSDKConfiguration().errorHandlingMode === "standard") {
+        const o = l;
+        o.error.code === 401 || o.error.code === 403 ? C(!0) : S(!0);
+      } else {
+        const o = l;
+        o.data.error.code === 401 || o.data.error.code === 403 ? C(!0) : S(!0);
+      }
+      r(!1);
+      return;
+    }
+    const a = await e.sdk.miniGames.getMyClassicQuizParticipations({
+      classicQuizIds: [e.entityId]
+    });
+    d(a), r(!1), L(!1);
+  }, p = () => {
+    const a = s > t.questionsCount ? t.questionsCount - 1 : s - 1, l = t.questions[a];
+    return e.template === y.OVERLAY ? /* @__PURE__ */ i.jsx(
+      ne,
+      {
+        sdk: e.sdk,
+        leads: e.leads,
+        classicQuiz: t,
+        question: l,
+        showAnswer: E,
+        selectedOption: h,
+        currentQuestion: s > t.questionsCount ? t.questionsCount : s,
+        answerQuestion: b,
+        handleNext: q,
+        isStopwatchRunning: z,
+        onTimeUpdate: V,
+        stopwatchTime: c,
+        applyFilterScreen: x,
+        startPlaying: v,
+        isSubmitting: m,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        rulesDisplay: e.rulesDisplay
+      }
+    ) : D(e) ? /* @__PURE__ */ i.jsx(
+      re,
+      {
+        sdk: e.sdk,
+        leads: e.leads,
+        classicQuiz: t,
+        question: l,
+        showAnswer: E,
+        selectedOption: h,
+        currentQuestion: s > t.questionsCount ? t.questionsCount : s,
+        answerQuestion: b,
+        handleNext: q,
+        imagePosition: e.imagePosition,
+        userParticipation: j,
+        isStopwatchRunning: z,
+        onTimeUpdate: V,
+        stopwatchTime: c,
+        applyFilterScreen: x,
+        startPlaying: v,
+        isSubmitting: m,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        rulesDisplay: e.rulesDisplay
+      }
+    ) : /* @__PURE__ */ i.jsx(
+      oe,
+      {
+        sdk: e.sdk,
+        leads: e.leads,
+        classicQuiz: t,
+        question: l,
+        showAnswer: E,
+        selectedOption: h,
+        currentQuestion: s > t.questionsCount ? t.questionsCount : s,
+        answerQuestion: b,
+        handleNext: q,
+        isStopwatchRunning: z,
+        onTimeUpdate: V,
+        stopwatchTime: c,
+        applyFilterScreen: x,
+        startPlaying: v,
+        isSubmitting: m,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        rulesDisplay: e.rulesDisplay
+      }
+    );
+  };
+  if (s > t.questionsCount && Z && ((H = e.leads) == null ? void 0 : H.position) === "after" && t.authRequirement === "LEAD")
+    return D(e) ? /* @__PURE__ */ i.jsx(
+      Se,
+      {
+        classicQuiz: t,
+        sdk: e.sdk,
+        leads: e.leads,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        onLeadSubmitted: F,
+        imagePosition: e.imagePosition,
+        isSubmitting: m,
+        rulesDisplay: e.rulesDisplay
+      }
+    ) : e.template === y.OVERLAY ? /* @__PURE__ */ i.jsx(
+      we,
+      {
+        classicQuiz: t,
+        sdk: e.sdk,
+        leads: e.leads,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        onLeadSubmitted: F,
+        isSubmitting: m,
+        rulesDisplay: e.rulesDisplay
+      }
+    ) : /* @__PURE__ */ i.jsx(
+      Ae,
+      {
+        classicQuiz: t,
+        sdk: e.sdk,
+        leads: e.leads,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        onLeadSubmitted: F,
+        isSubmitting: m,
+        rulesDisplay: e.rulesDisplay
+      }
+    );
+  if (s > t.questionsCount && Y.length || A) {
+    const a = A ? f[0] : Y[0];
+    return e.template === y.OVERLAY ? /* @__PURE__ */ i.jsx(
+      me,
+      {
+        summary: a,
+        totalTime: c,
+        showAnswerExplanations: e.showAnswerExplanations || !1,
+        classicQuiz: t,
+        maxAttemptsReached: A,
+        playAgain: M,
+        sdk: e.sdk,
+        leads: e.leads,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        additionalCTA: e.additionalCTA,
+        rulesDisplay: e.rulesDisplay
+      }
+    ) : D(e) ? /* @__PURE__ */ i.jsx(
+      ue,
+      {
+        imagePosition: e.imagePosition || "left",
+        summary: a,
+        totalTime: c,
+        showAnswerExplanations: e.showAnswerExplanations || !1,
+        classicQuiz: t,
+        maxAttemptsReached: A,
+        sdk: e.sdk,
+        leads: e.leads,
+        playAgain: M,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        additionalCTA: e.additionalCTA,
+        rulesDisplay: e.rulesDisplay
+      }
+    ) : /* @__PURE__ */ i.jsx(
+      de,
+      {
+        summary: a,
+        totalTime: c,
+        showAnswerExplanations: e.showAnswerExplanations || !1,
+        classicQuiz: t,
+        maxAttemptsReached: A,
+        playAgain: M,
+        sdk: e.sdk,
+        leads: e.leads,
+        defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
+        additionalCTA: e.additionalCTA,
+        rulesDisplay: e.rulesDisplay
+      }
+    );
+  }
+  return p();
+};
+export {
+  pe as default
+};

package/packages/classic-quiz-play/src/components/Leads/CollectLeadWrapper.js

@@ -0,0 +1,65 @@
+import { j as D } from "../../../../../node_modules/react/jsx-runtime.js";
+import { t as s } from "../../../../../node_modules/i18next/dist/esm/i18next.js";
+import "react";
+import "../../../../common/src/providers/ContainerProvider.js";
+import "../../../../../node_modules/i18next-browser-languagedetector/dist/esm/i18nextBrowserLanguageDetector.js";
+import "@mui/joy";
+import "../../../../common/src/providers/ConstantsProvider.js";
+import E from "../../../../common/src/components/Leads/CollectLeadForm.js";
+const A = ({
+  sdk: t,
+  contentId: e,
+  contentName: o,
+  brandingColors: i,
+  brandingUrls: c,
+  campaignId: a,
+  campaignName: n,
+  startGame: l,
+  fields: r = ["fullName", "email"],
+  leadTitle: m,
+  leadDescription: u,
+  leadCta: p,
+  leadSuccessTitle: d,
+  leadSuccessDescription: f,
+  syncWithProfile: b = !1,
+  isAfterPosition: x = !1,
+  isSubmittingParticipation: C = !1
+}) => {
+  const L = m ?? s("leads.header.title"), h = u ?? s("leads.header.description"), j = p ?? s("leads.buttons.submit"), z = d ?? s("leads.success.title"), g = f ?? s("leads.success.description"), Q = {
+    defaultLabel: x ? s("classicQuiz.buttons.finish") : s("classicQuiz.buttons.start"),
+    onClick: l
+  }, k = {
+    id: e,
+    type: "quiz",
+    name: o
+  }, q = {
+    colors: i,
+    urls: c
+  }, y = {
+    id: a,
+    name: n
+  }, B = {
+    title: L,
+    description: h,
+    submitButtonLabel: j,
+    successTitle: z,
+    successDescription: g
+  };
+  return /* @__PURE__ */ D.jsx(
+    E,
+    {
+      sdk: t,
+      content: k,
+      onSuccessCta: Q,
+      branding: q,
+      campaign: y,
+      fields: r,
+      labels: B,
+      syncWithProfile: b,
+      isSubmittingParticipation: C
+    }
+  );
+};
+export {
+  A as default
+};

package/packages/classic-quiz-play/src/components/Shared/AlertMessage.js

@@ -0,0 +1,93 @@
+import { j as e } from "../../../../../node_modules/react/jsx-runtime.js";
+import { useInternalTheme as a, useCornerRadius as f, useFontFamily as d } 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 { Alert as p, Stack as u, Typography as s } from "@mui/joy";
+import "react";
+import "../../../../common/src/providers/ConstantsProvider.js";
+import x from "../../../../../node_modules/@mui/icons-material/esm/CheckCircle.js";
+import h from "../../../../../node_modules/@mui/icons-material/esm/Info.js";
+import y from "../../../../../node_modules/@mui/icons-material/esm/Warning.js";
+import "../../../../common/src/providers/ContainerProvider.js";
+const g = (r, o) => {
+  switch (r) {
+    case "success":
+      return /* @__PURE__ */ e.jsx(x, {});
+    case "error":
+      return /* @__PURE__ */ e.jsx(y, { sx: { color: o } });
+    case "info":
+      return /* @__PURE__ */ e.jsx(h, {});
+  }
+}, j = (r) => {
+  switch (r) {
+    case "success":
+      return "success";
+    case "error":
+      return "danger";
+    case "info":
+      return "primary";
+  }
+}, T = ({
+  variant: r,
+  title: o,
+  message: i,
+  description: n
+}) => {
+  const m = a(), l = f(), t = d().secondary, c = j(r);
+  return /* @__PURE__ */ e.jsx(
+    p,
+    {
+      variant: "soft",
+      color: c,
+      startDecorator: g(
+        r,
+        m.colorSchemes.light.palette.danger.plainColor
+      ),
+      sx: {
+        gap: 1,
+        borderRadius: l.sm,
+        fontSize: "0.875em",
+        "--Icon-fontSize": "1.25em"
+      },
+      children: /* @__PURE__ */ e.jsxs(
+        u,
+        {
+          sx: {
+            fontSize: "1.5em"
+          },
+          children: [
+            o && /* @__PURE__ */ e.jsx(
+              s,
+              {
+                level: "title-md",
+                color: c,
+                fontWeight: "bold",
+                sx: { fontFamily: t, fontSize: "0.875em" },
+                children: o
+              }
+            ),
+            /* @__PURE__ */ e.jsx(
+              s,
+              {
+                level: "body-sm",
+                sx: { fontFamily: t, fontSize: "0.675em" },
+                children: i
+              }
+            ),
+            n && /* @__PURE__ */ e.jsx(
+              s,
+              {
+                level: "body-xs",
+                sx: { fontFamily: t, fontSize: "0.6em" },
+                children: n
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+};
+export {
+  T as default
+};

package/packages/classic-quiz-play/src/components/Shared/Answers/Answers.js

@@ -0,0 +1,80 @@
+import { j as o } from "../../../../../../node_modules/react/jsx-runtime.js";
+import { Box as t } from "@mui/joy";
+import r from "./Option.js";
+import { isMobile as m } 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 "react";
+import "../../../../../common/src/providers/ConstantsProvider.js";
+import "../../../../../common/src/providers/ContainerProvider.js";
+const j = (e) => {
+  const l = m();
+  if (e.optionsLayout === "twoByTwo") {
+    const n = [];
+    for (let i = 0; i < e.options.length; i += 2) {
+      const s = e.options.slice(i, i + 2);
+      n.push(s);
+    }
+    return /* @__PURE__ */ o.jsx(t, { sx: { py: 2, display: "flex", flexDirection: "column", gap: 2 }, children: n.map((i, s) => /* @__PURE__ */ o.jsx(
+      t,
+      {
+        sx: {
+          display: "flex",
+          flexDirection: l ? "column" : "row",
+          gap: 2
+        },
+        children: i.map((a) => /* @__PURE__ */ o.jsx(
+          r,
+          {
+            option: a,
+            showAnswer: e.showAnswer,
+            questionImage: e.questionImage,
+            selectedOption: e.selectedOption,
+            answerQuestion: e.answerQuestion,
+            brandingColors: e.brandingColors
+          },
+          a.optionId
+        ))
+      },
+      `row-${s}`
+    )) });
+  }
+  return e.optionsLayout === "column" ? /* @__PURE__ */ o.jsx(t, { sx: { py: 2, display: "flex", flexDirection: "column", gap: 2 }, children: e.options.map((n) => /* @__PURE__ */ o.jsx(
+    r,
+    {
+      option: n,
+      showAnswer: e.showAnswer,
+      selectedOption: e.selectedOption,
+      questionImage: e.questionImage,
+      answerQuestion: e.answerQuestion,
+      brandingColors: e.brandingColors
+    },
+    n.optionId
+  )) }) : /* @__PURE__ */ o.jsx(
+    t,
+    {
+      sx: {
+        py: 2,
+        display: "flex",
+        flexWrap: "wrap",
+        flexDirection: l ? "column" : "row",
+        gap: 2
+      },
+      children: e.options.map((n) => /* @__PURE__ */ o.jsx(
+        r,
+        {
+          option: n,
+          showAnswer: e.showAnswer,
+          selectedOption: e.selectedOption,
+          questionImage: e.questionImage,
+          answerQuestion: e.answerQuestion,
+          brandingColors: e.brandingColors
+        },
+        n.optionId
+      ))
+    }
+  );
+};
+export {
+  j as default
+};