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

package/packages/poll-vote/src/components/Variants/Standard/PollStandardVariant.js

@@ -0,0 +1,138 @@
+import { j as l } from "../../../../../../node_modules/react/jsx-runtime.js";
+import M from "react";
+import { Box as n, Typography as oe } from "@mui/joy";
+import { isMobile as te, isExtraSmall as ne, useColors as c, useFontFamily as ie, useCornerRadius as ae, useSpacingScale as se } from "../../../../../common/src/functions/theme.js";
+import { hexToRgb as re } 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 me } from "../../../../../common/src/enums/enums.js";
+import { useConstantContext as de } from "../../../../../common/src/hooks/useConstantContext.js";
+import { ConstantsContext as ce } from "../../../../../common/src/providers/ConstantsProvider.js";
+import ue from "../../../../../common/src/components/Skeletons/Standard/StandardSkeleton.js";
+import { useImageVariant as ge } from "../../../../../common/src/hooks/useImageVariant.js";
+import "../../../../../common/src/providers/ContainerProvider.js";
+import xe from "../../Shared/Button.js";
+import fe from "../../Shared/MainCard.js";
+import Ce from "../../Shared/PresentedBy.js";
+import be from "../../Leads/CollectLeadWrapper.js";
+import { useEmbedCode as he } from "../../../hooks/useEmbedCodeContainer.js";
+import { createStyles as ye } from "./PollStandardVariant.styles.js";
+import je from "../../Shared/Answers/PollOptions.js";
+import { usePollOptionsImages as Se } from "../../../hooks/usePollOptionsImages.js";
+import { useTranslation as Pe } from "../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
+const Qe = (e) => {
+  var C, b, h, y, j, S, P, L, T, D, E, F, R, I, q, B, U, V, k, v, w;
+  const [u, g] = M.useState(
+    ((C = e.leads) == null ? void 0 : C.position) === "before" && e.poll.authRequirement === "LEAD"
+  );
+  M.useEffect(() => {
+    var s;
+    g(
+      ((s = e.leads) == null ? void 0 : s.position) === "before" && e.poll.authRequirement === "LEAD" || !1
+    );
+  }, [(b = e.leads) == null ? void 0 : b.position, e.poll.authRequirement]);
+  const { optionsLayout: _ } = de(ce), G = he(e.poll.embedCode), Q = !u && !!e.poll.embedCode, z = Se(e.options), { t: r } = Pe(), x = te(), H = ne(), o = ((h = e.poll.branding) == null ? void 0 : h.colors) || null, i = x ? ((j = (y = e.poll.branding) == null ? void 0 : y.images) == null ? void 0 : j.mobileLogo) || ((P = (S = e.poll.branding) == null ? void 0 : S.images) == null ? void 0 : P.mainLogo) || "" : ((T = (L = e.poll.branding) == null ? void 0 : L.images) == null ? void 0 : T.mainLogo) || "", J = e.imagePosition || "left", f = ge(
+    {
+      images: e.poll.images,
+      imagePlaceholder: e.defaultImagePlaceholderUrl ? e.defaultImagePlaceholderUrl : ""
+    },
+    me.STANDARD
+  ), K = ((D = e.leads) == null ? void 0 : D.position) === "after" ? r("poll.buttons.continue") : r("poll.buttons.vote"), m = H || x && !!f, a = (o == null ? void 0 : o.contentColor) || c().textColor, X = ie().primary, Y = (o == null ? void 0 : o.backgroundColor) || c().surfaceVariant, Z = ae().md, $ = (o == null ? void 0 : o.primaryColor) || c().palette.primary.plainColor, ee = se(), t = ye({
+    spacingScale: ee,
+    fontFamilyPrimary: X,
+    textColor: a,
+    bgcolor: re(Y || ""),
+    mdBorderRadius: Z,
+    isExtraSmall: m
+  }), le = () => {
+    g(!1);
+  }, d = (s) => {
+    var O, p, A, N, W;
+    return /* @__PURE__ */ l.jsx(
+      Ce,
+      {
+        brandingLogo: i,
+        textColor: s,
+        label: ((O = e.poll.labels) == null ? void 0 : O.sponsor) || null,
+        primaryUrl: (A = (p = e.poll.branding) == null ? void 0 : p.urls) == null ? void 0 : A.primaryUrl,
+        secondaryUrl: (W = (N = e.poll.branding) == null ? void 0 : N.urls) == null ? void 0 : W.secondaryUrl
+      }
+    );
+  };
+  return /* @__PURE__ */ l.jsx(fe, { brandingBorderColor: (o == null ? void 0 : o.borderColor) || null, children: /* @__PURE__ */ l.jsx(
+    ue,
+    {
+      entity: e.poll,
+      headline: r("poll.headline"),
+      finalImage: f,
+      imagePosition: J,
+      rulesDisplay: e.rulesDisplay,
+      embedCodeContainerRef: G,
+      hasEmbedCode: Q,
+      children: /* @__PURE__ */ l.jsx(l.Fragment, { children: u ? /* @__PURE__ */ l.jsx(n, { sx: t.leadCollectionContainer, children: /* @__PURE__ */ l.jsxs(n, { sx: t.leadQuestionContainer, children: [
+        /* @__PURE__ */ l.jsx(n, { sx: t.leadContentContainer, children: /* @__PURE__ */ l.jsx(
+          be,
+          {
+            sdk: e.sdk,
+            startGame: le,
+            contentId: e.poll.id,
+            contentName: e.poll.title,
+            brandingColors: (E = e.poll.branding) == null ? void 0 : E.colors,
+            brandingUrls: (F = e.poll.branding) == null ? void 0 : F.urls,
+            campaignId: (R = e.leads) == null ? void 0 : R.campaignId,
+            campaignName: (I = e.leads) == null ? void 0 : I.campaignName,
+            fields: (q = e.leads) == null ? void 0 : q.fields,
+            leadTitle: (B = e.poll.labels) == null ? void 0 : B.leadTitle,
+            leadDescription: (U = e.poll.labels) == null ? void 0 : U.leadDescription,
+            leadCta: (V = e.poll.labels) == null ? void 0 : V.leadCta,
+            leadSuccessTitle: (k = e.poll.labels) == null ? void 0 : k.leadSuccessTitle,
+            leadSuccessDescription: (v = e.poll.labels) == null ? void 0 : v.leadSuccessDescription,
+            syncWithProfile: (w = e.leads) == null ? void 0 : w.syncWithProfile
+          }
+        ) }),
+        d(a)
+      ] }) }) : /* @__PURE__ */ l.jsx(l.Fragment, { children: /* @__PURE__ */ l.jsx(n, { sx: t.questionArea, children: /* @__PURE__ */ l.jsxs(n, { sx: t.questionContainer, children: [
+        /* @__PURE__ */ l.jsxs(n, { sx: t.questionContentContainer, children: [
+          e.poll.alternativeTitle ? /* @__PURE__ */ l.jsx(n, { sx: t.questionTextContainer, children: /* @__PURE__ */ l.jsx(oe, { level: "body-lg", sx: t.questionText, children: e.poll.alternativeTitle }) }) : /* @__PURE__ */ l.jsx(l.Fragment, {}),
+          /* @__PURE__ */ l.jsx(
+            je,
+            {
+              options: e.options || [],
+              answerPoll: e.answerPoll,
+              selectedOptions: e.selectedOptions,
+              optionsLayout: _ ?? "twoByTwo",
+              optionsImages: z,
+              brandingColors: o,
+              multipleChoice: e.poll.multipleChoice,
+              maxChoices: e.optionChoices,
+              isVoting: e.isVoting
+            }
+          )
+        ] }),
+        /* @__PURE__ */ l.jsxs(
+          n,
+          {
+            sx: i ? t.footerContainer : t.footerContainerNoLogo,
+            children: [
+              i && !m ? d(a) : /* @__PURE__ */ l.jsx(l.Fragment, {}),
+              /* @__PURE__ */ l.jsx(n, { sx: t.navigationContainer, children: /* @__PURE__ */ l.jsx(
+                xe,
+                {
+                  selectedOptions: e.selectedOptions,
+                  label: K,
+                  buttonColor: $,
+                  onClick: e.voteForPoll,
+                  isVoting: e.isVoting
+                }
+              ) })
+            ]
+          }
+        ),
+        i && m ? d(a) : /* @__PURE__ */ l.jsx(l.Fragment, {})
+      ] }) }) }) })
+    }
+  ) });
+};
+export {
+  Qe as default
+};

package/packages/poll-vote/src/components/Variants/Standard/PollStandardVariant.styles.js

@@ -0,0 +1,92 @@
+const l = (e) => ({
+  // Lead collection container
+  leadCollectionContainer: {
+    display: "flex",
+    flexDirection: "column",
+    p: e.spacingScale.md
+  },
+  // Lead question container
+  leadQuestionContainer: {
+    display: "flex",
+    flexDirection: "column",
+    gap: { xs: e.spacingScale.lg, md: e.spacingScale.md }
+  },
+  // Lead content container
+  leadContentContainer: {
+    borderRadius: e.mdBorderRadius,
+    px: e.spacingScale.md,
+    pt: e.spacingScale.md,
+    pb: e.spacingScale.lg,
+    gap: e.spacingScale.md,
+    bgcolor: `rgba(${e.bgcolor ? e.bgcolor.replace(/[^\d,]/g, "") : ""}, 0.5)`,
+    display: "flex",
+    flexDirection: "column",
+    backdropFilter: "blur(4px)"
+  },
+  // Question area
+  questionArea: {
+    display: "flex",
+    flexDirection: "column",
+    p: e.spacingScale.md
+  },
+  // Question container
+  questionContainer: {
+    display: "flex",
+    flexDirection: "column",
+    gap: { xs: e.spacingScale.lg, md: e.spacingScale.md }
+  },
+  // Question content container
+  questionContentContainer: {
+    borderRadius: e.mdBorderRadius,
+    px: e.spacingScale.md,
+    pt: e.spacingScale.md,
+    pb: e.spacingScale.lg,
+    gap: e.spacingScale.md,
+    bgcolor: `rgba(${e.bgcolor ? e.bgcolor.replace(/[^\d,]/g, "") : ""}, 0.5)`,
+    display: "flex",
+    flexDirection: "column",
+    backdropFilter: "blur(4px)"
+  },
+  // Question text container
+  questionTextContainer: {
+    gap: "8px",
+    display: "flex",
+    justifyContent: "center"
+  },
+  // Question text
+  questionText: {
+    fontFamily: e.fontFamilyPrimary,
+    lineHeight: "150%",
+    letterSpacing: "0.15px",
+    fontWeight: 500,
+    fontSize: "1.25em",
+    textAlign: "center",
+    color: e.textColor
+  },
+  // Footer container
+  footerContainer: {
+    display: "flex",
+    flexDirection: e.isExtraSmall ? "column" : "row",
+    justifyContent: "space-between",
+    alignItems: "center",
+    gap: e.spacingScale.lg
+  },
+  // Footer container (no logo)
+  footerContainerNoLogo: {
+    display: "flex",
+    flexDirection: e.isExtraSmall ? "column" : "row",
+    justifyContent: "flex-end",
+    alignItems: "center",
+    gap: e.spacingScale.lg
+  },
+  // Navigation container
+  navigationContainer: {
+    display: "flex",
+    gap: e.spacingScale.md,
+    justifyContent: "center",
+    alignItems: "center"
+  }
+});
+export {
+  l as createStyles
+};

package/packages/poll-vote/src/components/Variants/Standard/ScoreState/PollStandardScoreState.js

@@ -0,0 +1,146 @@
+import { j as t } from "../../../../../../../node_modules/react/jsx-runtime.js";
+import { Box as n, Typography as C, Button as B } from "@mui/joy";
+import { isMobile as v, useColors as I, useSpacingScale as P } 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 F } from "../../../../../../common/src/enums/enums.js";
+import M from "../../../../../../common/src/components/AdditionalCTA.js";
+import "react";
+import { useConstantContext as L } from "../../../../../../common/src/hooks/useConstantContext.js";
+import { ConstantsContext as q } from "../../../../../../common/src/providers/ConstantsProvider.js";
+import R from "../../../../../../common/src/components/Skeletons/Standard/ScoreState/StandardScoreStateSkeleton.js";
+import D from "../../../../../../../node_modules/@mui/icons-material/esm/Replay.js";
+import { useImageVariant as O } from "../../../../../../common/src/hooks/useImageVariant.js";
+import "../../../../../../common/src/providers/ContainerProvider.js";
+import V from "../../../Shared/MainCard.js";
+import r from "../../../Shared/PresentedBy.js";
+import { createStyles as k } from "./PollStandardScoreState.styles.js";
+import U from "../../../Shared/AlertMessage.js";
+import { usePollOptionsImages as w } from "../../../../hooks/usePollOptionsImages.js";
+import N from "../../../Shared/Results/PollOptionsResults.js";
+import { useTranslation as z } from "../../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
+const dt = (e) => {
+  var m, d, x, c;
+  const f = O(
+    {
+      images: e.poll.images,
+      imagePlaceholder: e.defaultImagePlaceholderUrl ? e.defaultImagePlaceholderUrl : ""
+    },
+    F.STANDARD
+  ), { optionsLayout: y } = L(q), { t: a } = z(), i = ((m = e.poll.branding) == null ? void 0 : m.colors) || null, l = v() ? ((d = e.poll.branding) == null ? void 0 : d.images.mobileLogo) || ((x = e.poll.branding) == null ? void 0 : x.images.mainLogo) || "" : ((c = e.poll.branding) == null ? void 0 : c.images.mainLogo) || "", b = e.imagePosition || "left", A = w(e.poll.options), s = (i == null ? void 0 : i.contentColor) || I().textColor, T = P(), o = k({
+    spacingScale: T,
+    textColor: s
+  }), S = () => {
+    var g, u, j, h, p;
+    return /* @__PURE__ */ t.jsx(t.Fragment, { children: e.isUnauthorized ? /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      /* @__PURE__ */ t.jsx(
+        U,
+        {
+          variant: "error",
+          title: a("common.authentication.accessRequired"),
+          message: a("common.authentication.invalidOrMissingAuth")
+        }
+      ),
+      l ? /* @__PURE__ */ t.jsx(
+        r,
+        {
+          brandingLogo: l,
+          textColor: s,
+          label: ((p = e.poll.labels) == null ? void 0 : p.sponsor) || null
+        }
+      ) : /* @__PURE__ */ t.jsx(t.Fragment, {})
+    ] }) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      /* @__PURE__ */ t.jsx(n, { sx: o.questionArea, children: /* @__PURE__ */ t.jsx(n, { sx: o.questionContainer, children: /* @__PURE__ */ t.jsxs(n, { sx: o.questionContentContainer, children: [
+        e.poll.alternativeTitle ? /* @__PURE__ */ t.jsx(n, { sx: o.alternativeTitleSection, children: /* @__PURE__ */ t.jsx(
+          C,
+          {
+            level: "body-lg",
+            sx: o.alternativeTitleText,
+            children: e.poll.alternativeTitle
+          }
+        ) }) : /* @__PURE__ */ t.jsx(t.Fragment, {}),
+        /* @__PURE__ */ t.jsx(
+          N,
+          {
+            options: e.poll.options,
+            selectedOptions: ((g = e.userVote) == null ? void 0 : g.optionIds) || [],
+            optionsLayout: y ?? "twoByTwo",
+            optionsImages: A,
+            brandingColors: ((u = e.poll.branding) == null ? void 0 : u.colors) || null
+          }
+        )
+      ] }) }) }),
+      /* @__PURE__ */ t.jsx(n, { sx: o.questionArea, children: /* @__PURE__ */ t.jsxs(n, { sx: o.questionContainer, children: [
+        /* @__PURE__ */ t.jsxs(
+          n,
+          {
+            sx: l ? o.footerContainer : o.footerContainerNoLogo,
+            children: [
+              l ? /* @__PURE__ */ t.jsx(n, { sx: o.presentedByDesktop, children: /* @__PURE__ */ t.jsx(
+                r,
+                {
+                  brandingLogo: l,
+                  textColor: s,
+                  label: ((j = e.poll.labels) == null ? void 0 : j.sponsor) || null
+                }
+              ) }) : /* @__PURE__ */ t.jsx(t.Fragment, {}),
+              /* @__PURE__ */ t.jsxs(
+                n,
+                {
+                  sx: {
+                    display: "flex",
+                    gap: "16px"
+                  },
+                  children: [
+                    /* @__PURE__ */ t.jsx(
+                      M,
+                      {
+                        additionalCTA: e.additionalCTA,
+                        buttonStyle: o.additionalCTAButton,
+                        buttonContentStyle: o.additionalCTAButtonContent,
+                        textStyle: o.additionalCTAText
+                      }
+                    ),
+                    e.maxAttemptsReached ? /* @__PURE__ */ t.jsx(t.Fragment, {}) : /* @__PURE__ */ t.jsx(
+                      B,
+                      {
+                        sx: o.voteAgainButton,
+                        onClick: e.voteAgain,
+                        children: /* @__PURE__ */ t.jsxs(n, { sx: o.playAgainButtonContent, children: [
+                          /* @__PURE__ */ t.jsx(D, { sx: o.playAgainIcon }),
+                          /* @__PURE__ */ t.jsx(C, { sx: o.playAgainText, children: a("poll.buttons.voteAgain") })
+                        ] })
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        l ? /* @__PURE__ */ t.jsx(n, { sx: o.presentedByMobile, children: /* @__PURE__ */ t.jsx(
+          r,
+          {
+            brandingLogo: l,
+            textColor: s,
+            label: ((h = e.poll.labels) == null ? void 0 : h.sponsor) || null
+          }
+        ) }) : /* @__PURE__ */ t.jsx(t.Fragment, {})
+      ] }) })
+    ] }) });
+  };
+  return /* @__PURE__ */ t.jsx(V, { brandingBorderColor: (i == null ? void 0 : i.borderColor) || null, children: /* @__PURE__ */ t.jsx(
+    R,
+    {
+      entity: e.poll,
+      headline: a("poll.headline"),
+      finalImage: f,
+      imagePosition: b,
+      rulesDisplay: e.rulesDisplay,
+      children: S()
+    }
+  ) });
+};
+export {
+  dt as default
+};

package/packages/poll-vote/src/components/Variants/Standard/ScoreState/PollStandardScoreState.styles.js

@@ -0,0 +1,164 @@
+import { useCornerRadius as m, isMobile as f, useBorderSize as d, useColors as y, useFontFamily as u } from "../../../../../../common/src/functions/theme.js";
+import { hexToRgb as S } 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 "../../../../../../../node_modules/react/jsx-runtime.js";
+import "@mui/joy";
+import "react";
+import "../../../../../../common/src/providers/ConstantsProvider.js";
+import "../../../../../../common/src/providers/ContainerProvider.js";
+const I = (e) => {
+  const o = m(), n = f(), a = d().size, t = y(), i = u(), r = t.palette.primary.plainColor, c = t.textPrimary, s = t.textSecondary, l = t.secondaryContainer, p = t.surface, g = t.onSurface, x = `rgba(${S(t.surfaceVariant)}, 0.5)`;
+  return {
+    // Question area
+    questionArea: {
+      display: "flex",
+      flexDirection: "column",
+      px: e.spacingScale.md
+    },
+    // Question container
+    questionContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: n ? e.spacingScale.lg : e.spacingScale.md
+    },
+    // Question content container
+    questionContentContainer: {
+      borderRadius: o.md,
+      px: e.spacingScale.md,
+      pt: e.spacingScale.md,
+      pb: e.spacingScale.lg,
+      gap: e.spacingScale.md,
+      bgcolor: x,
+      display: "flex",
+      flexDirection: "column",
+      backdropFilter: "blur(4px)"
+    },
+    // Vote again button
+    voteAgainButton: {
+      display: "flex",
+      py: e.spacingScale.xs,
+      px: "16px",
+      flexDirection: "column",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: "8px",
+      borderRadius: o.xl,
+      border: a + " solid " + r,
+      bgcolor: p,
+      "&:hover": {
+        bgcolor: g,
+        borderColor: r
+      },
+      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: c
+    },
+    // Play again text
+    playAgainText: {
+      color: c,
+      textAlign: "center",
+      fontFamily: i.primary,
+      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.xs,
+      px: e.spacingScale.md,
+      flexDirection: "column",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: "8px",
+      borderRadius: o.xl,
+      border: a + " solid " + l,
+      bgcolor: l,
+      "&:hover": {
+        bgcolor: l,
+        opacity: 0.9
+      },
+      fontSize: "0.8125em"
+    },
+    // Additional CTA button content
+    additionalCTAButtonContent: {
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: "8px"
+    },
+    // Additional CTA text
+    additionalCTAText: {
+      color: s,
+      fontFamily: i.primary,
+      fontSize: "0.8125em",
+      fontStyle: "normal",
+      fontWeight: 500,
+      lineHeight: "22px",
+      letterSpacing: "0.46px",
+      textTransform: "uppercase"
+    },
+    // Footer container
+    footerContainer: {
+      display: "flex",
+      flexDirection: n ? "column" : "row",
+      justifyContent: "space-between",
+      alignItems: "center",
+      gap: e.spacingScale.lg
+    },
+    // Footer container (no logo)
+    footerContainerNoLogo: {
+      display: "flex",
+      flexDirection: n ? "column" : "row",
+      justifyContent: "flex-end",
+      alignItems: "center",
+      gap: e.spacingScale.lg
+    },
+    // Presented by desktop
+    presentedByDesktop: {
+      display: n ? "none" : "block"
+    },
+    // Presented by mobile
+    presentedByMobile: {
+      display: n ? "block" : "none"
+    },
+    // Alternative title section
+    alternativeTitleSection: {
+      gap: "8px",
+      display: "flex",
+      justifyContent: "center"
+    },
+    // Alternative title text
+    alternativeTitleText: {
+      fontFamily: i.primary,
+      lineHeight: "150%",
+      letterSpacing: "0.15px",
+      fontWeight: 500,
+      fontSize: "1.25em",
+      textAlign: "center",
+      color: e.textColor
+    }
+  };
+};
+export {
+  I as createStyles
+};

package/packages/poll-vote/src/components/Variants/Standard/SignIn/PollStandardSignIn.js

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