fansunited-frontend-components 0.0.38 → 0.0.39

package/PollVote.js

@@ -1,16 +1,17 @@
 import { jsxs as x, Fragment as B, jsx as t } from "react/jsx-runtime";
 import Ie, { useState as J, useEffect as Be, useRef as ot, useMemo as Xe } from "react";
-import { e as N, u as Z, f as ee, v as _, w as Y, x as F, y as ze, W as V, B as l, T as h, a7 as at, a0 as G, a2 as je, a1 as Te, aj as Ae, a3 as We, a5 as p, aq as rt, c as ct, ao as st, i as dt } from "./chunks/ConstantsProvider-YKCgQ1mh.js";
-import { P as gt } from "./chunks/Portal-CfeOliT5.js";
-import { h as Ce, s as Ue, g as mt, e as Ve, d as he, a as be, u as ie, b as tt, n as ut } from "./chunks/useImageVariant-BB7FL7DQ.js";
-import { S as ft } from "./chunks/Spinner-kT93nizf.js";
+import { e as N, u as Z, f as ee, v as _, w as Y, x as F, y as ze, W as V, B as l, T as h, a7 as at, a0 as G, a2 as Ee, a1 as Te, am as Ae, a3 as We, a5 as p, aq as rt, d as ct, ao as st, i as dt } from "./chunks/ConstantsProvider-BPJJz9fq.js";
+import { P as gt } from "./chunks/Portal-DWAr8MhA.js";
+import { h as Ce, s as Ue, g as mt, e as Ve, d as he, a as be, u as ie, b as tt, n as ut } from "./chunks/useImageVariant-Do8kOVs2.js";
+import { S as ft } from "./chunks/Spinner-m59ZJZ35.js";
 import "react-dom";
-import { g as xt, M as yt, S as ht, A as Ge, R as pe, a as bt, O as nt, b as lt, c as it, C as Ze, d as et } from "./chunks/ChanceGameEmbedVariant-B5jX_jMO.js";
-import { R as Oe, A as Me, O as Ct, S as St, N as It } from "./chunks/useInfoPage-Cjw5ykNz.js";
-import { C as Tt } from "./chunks/CollectLeadForm-D7pLjJkA.js";
-import { e as At, d as Pt, f as kt, W as vt, C as Ft } from "./chunks/AlertMessage-DZAXIV4L.js";
-import { O as Dt } from "./chunks/OverlayScoreStateSkeleton-BEe63pWp.js";
-import { S as Lt, a as Rt, O as wt, b as Bt, c as zt, d as Wt } from "./chunks/OverlayLeadAfterCollection-9i_et1r0.js";
+import { g as xt, M as yt, S as ht, A as Ge, R as pe, a as bt, O as nt, b as lt, c as it, C as Ze, d as et } from "./chunks/ChanceGameEmbedVariant-BvIKBhq_.js";
+import { R as Oe, A as Me, O as Ct, S as St, N as It } from "./chunks/useInfoPage-v91yL5SS.js";
+import { C as Tt } from "./chunks/CollectLeadForm-o9NdYQgu.js";
+import { C as At } from "./chunks/CheckCircle-D-GH16Lb.js";
+import { e as Pt, d as kt, f as vt, W as Ft } from "./chunks/AlertMessage-C2aBXCrl.js";
+import { O as Dt } from "./chunks/OverlayScoreStateSkeleton-xvq9lQEi.js";
+import { S as Lt, a as Rt, O as wt, b as Bt, c as zt, d as Wt } from "./chunks/OverlayLeadAfterCollection-B3D5ct0J.js";
 const Vt = (e) => {
   var n, o, i;
   return {
@@ -548,7 +549,7 @@ const Vt = (e) => {
       isSubmittingParticipation: A
     }
   );
-}, Ee = (e) => {
+}, je = (e) => {
   const n = ot(null);
   return Be(() => {
     var o;
@@ -573,7 +574,7 @@ const Vt = (e) => {
       n.current && (n.current.innerHTML = "");
     };
   }, [e]), n;
-}, jt = (e) => ({
+}, Et = (e) => ({
   // Main content section (non-filter screen)
   mainContentSection: {
     display: "flex",
@@ -676,7 +677,7 @@ const Vt = (e) => {
   }
 }), qe = (e) => {
   var b;
-  const n = Z(), o = F(), i = Y().sm, s = _().primary, c = Y().xs, a = ee(), u = je().size, g = Ee(e.option.embedCode || ""), y = !!e.option.embedCode, d = ((b = e.brandingColors) == null ? void 0 : b.primaryColor) || o.palette.primary.plainColor, m = o.palette.primary.onPrimary, f = e.selectedOptions.includes(e.option.id) ? m : n.colorSchemes.light.textColor, k = e.optionsImages.get(e.option.id), I = () => {
+  const n = Z(), o = F(), i = Y().sm, s = _().primary, c = Y().xs, a = ee(), u = Ee().size, g = je(e.option.embedCode || ""), y = !!e.option.embedCode, d = ((b = e.brandingColors) == null ? void 0 : b.primaryColor) || o.palette.primary.plainColor, m = o.palette.primary.onPrimary, f = e.selectedOptions.includes(e.option.id) ? m : n.colorSchemes.light.textColor, k = e.optionsImages.get(e.option.id), I = () => {
     e.multipleChoice ? e.answerPoll([e.option.id]) : e.answerPoll([e.option.id]);
   }, r = e.selectedOptions.includes(e.option.id), A = e.isVoting || e.multipleChoice && !r && e.selectedOptions.length >= (e.maxChoices || 1), S = () => y ? /* @__PURE__ */ x(B, { children: [
     /* @__PURE__ */ t(
@@ -875,8 +876,8 @@ const Vt = (e) => {
     const c = (o ? (a = i.images) == null ? void 0 : a.mobile : (u = i.images) == null ? void 0 : u.main) || "";
     n.set(i.id, c);
   }), n;
-}, Et = (e) => {
-  var U, R, O, W, M, K, Q, j, q, w, te, oe, ae, re, ce, se, de, ge, ne, me, ue, fe, xe, ye, ve, Fe;
+}, jt = (e) => {
+  var U, R, O, W, M, K, Q, E, q, w, te, oe, ae, re, ce, se, de, ge, ne, me, ue, fe, xe, ye, ve, Fe;
   const [n, o] = Ie.useState(
     ((U = e.leads) == null ? void 0 : U.position) === "before" && e.poll.authRequirement === "LEAD"
   );
@@ -886,13 +887,13 @@ const Vt = (e) => {
       ((le = e.leads) == null ? void 0 : le.position) === "before" && e.poll.authRequirement === "LEAD" || !1
     );
   }, [(R = e.leads) == null ? void 0 : R.position, e.poll.authRequirement]);
-  const { optionsLayout: i } = Te(Ae), s = ee(), c = Z(), a = ke(e.options), { t: u } = G(), g = N(), y = We(), d = Ee(e.poll.embedCode), m = !n && !!e.poll.embedCode, f = ((O = e.leads) == null ? void 0 : O.position) === "after" ? u("poll.buttons.continue") : u("poll.buttons.vote"), { brandingImage: k, brandingColors: I, brandingLogo: r } = Ve(e.poll.branding || null), A = e.defaultImagePlaceholderUrl ? e.defaultImagePlaceholderUrl : N() ? he : be, S = k || ie(
+  const { optionsLayout: i } = Te(Ae), s = ee(), c = Z(), a = ke(e.options), { t: u } = G(), g = N(), y = We(), d = je(e.poll.embedCode), m = !n && !!e.poll.embedCode, f = ((O = e.leads) == null ? void 0 : O.position) === "after" ? u("poll.buttons.continue") : u("poll.buttons.vote"), { brandingImage: k, brandingColors: I, brandingLogo: r } = Ve(e.poll.branding || null), A = e.defaultImagePlaceholderUrl ? e.defaultImagePlaceholderUrl : N() ? he : be, S = k || ie(
     {
       images: e.poll.images,
       imagePlaceholder: A
     },
     V.OVERLAY
-  ), b = c.customRadius.dark.sm, P = (I == null ? void 0 : I.backgroundColor) || ((M = (W = c.colorSchemes) == null ? void 0 : W.dark) == null ? void 0 : M.surfaceVariant), D = (Q = (K = c.customRadius) == null ? void 0 : K.light) == null ? void 0 : Q.xl, T = (I == null ? void 0 : I.primaryColor) || ((te = (w = (q = (j = c.colorSchemes) == null ? void 0 : j.light) == null ? void 0 : q.palette) == null ? void 0 : w.primary) == null ? void 0 : te.plainColor), C = (ce = (re = (ae = (oe = c.colorSchemes) == null ? void 0 : oe.light) == null ? void 0 : ae.palette) == null ? void 0 : re.primary) == null ? void 0 : ce.onPrimary, z = c.customFontFamily.dark.primary, L = c.colorSchemes.dark.textColor, v = jt({
+  ), b = c.customRadius.dark.sm, P = (I == null ? void 0 : I.backgroundColor) || ((M = (W = c.colorSchemes) == null ? void 0 : W.dark) == null ? void 0 : M.surfaceVariant), D = (Q = (K = c.customRadius) == null ? void 0 : K.light) == null ? void 0 : Q.xl, T = (I == null ? void 0 : I.primaryColor) || ((te = (w = (q = (E = c.colorSchemes) == null ? void 0 : E.light) == null ? void 0 : q.palette) == null ? void 0 : w.primary) == null ? void 0 : te.plainColor), C = (ce = (re = (ae = (oe = c.colorSchemes) == null ? void 0 : oe.light) == null ? void 0 : ae.palette) == null ? void 0 : re.primary) == null ? void 0 : ce.onPrimary, z = c.customFontFamily.dark.primary, L = c.colorSchemes.dark.textColor, v = Et({
     spacingScale: s,
     smBorderRadius: b,
     contentBgColor: P,
@@ -904,7 +905,7 @@ const Vt = (e) => {
     isMobile: g
   }), H = () => {
     o(!1);
-  }, E = () => {
+  }, j = () => {
     var le, He, De, Le, Re;
     return /* @__PURE__ */ t(
       $,
@@ -970,7 +971,7 @@ const Vt = (e) => {
           )
         ] }) }),
         /* @__PURE__ */ x(l, { sx: v.bottomFooterContainer, children: [
-          E(),
+          j(),
           !n && /* @__PURE__ */ t(
             p,
             {
@@ -1055,7 +1056,7 @@ const Vt = (e) => {
   brandingBorderColor: n,
   state: o
 }) => {
-  const i = N(), s = We(), c = o === "play" ? s : i, a = Y().md, u = n || F().secondaryContainer, y = je().size + " solid " + u;
+  const i = N(), s = We(), c = o === "play" ? s : i, a = Y().md, u = n || F().secondaryContainer, y = Ee().size + " solid " + u;
   return /* @__PURE__ */ t(
     l,
     {
@@ -1163,7 +1164,7 @@ const Vt = (e) => {
     alignItems: "center"
   }
 }), qt = (e) => {
-  var v, H, E, U, R, O, W, M, K, Q, j, q, w, te, oe, ae, re, ce, se, de, ge;
+  var v, H, j, U, R, O, W, M, K, Q, E, q, w, te, oe, ae, re, ce, se, de, ge;
   const [n, o] = Ie.useState(
     ((v = e.leads) == null ? void 0 : v.position) === "before" && e.poll.authRequirement === "LEAD"
   );
@@ -1173,7 +1174,7 @@ const Vt = (e) => {
       ((ne = e.leads) == null ? void 0 : ne.position) === "before" && e.poll.authRequirement === "LEAD" || !1
     );
   }, [(H = e.leads) == null ? void 0 : H.position, e.poll.authRequirement]);
-  const { optionsLayout: i } = Te(Ae), s = Ee(e.poll.embedCode), c = !n && !!e.poll.embedCode, a = ke(e.options), { t: u } = G(), g = N(), y = rt(), d = ((E = e.poll.branding) == null ? void 0 : E.colors) || null, m = g ? ((R = (U = e.poll.branding) == null ? void 0 : U.images) == null ? void 0 : R.mobileLogo) || ((W = (O = e.poll.branding) == null ? void 0 : O.images) == null ? void 0 : W.mainLogo) || "" : ((K = (M = e.poll.branding) == null ? void 0 : M.images) == null ? void 0 : K.mainLogo) || "", f = e.imagePosition || "left", k = ie(
+  const { optionsLayout: i } = Te(Ae), s = je(e.poll.embedCode), c = !n && !!e.poll.embedCode, a = ke(e.options), { t: u } = G(), g = N(), y = rt(), d = ((j = e.poll.branding) == null ? void 0 : j.colors) || null, m = g ? ((R = (U = e.poll.branding) == null ? void 0 : U.images) == null ? void 0 : R.mobileLogo) || ((W = (O = e.poll.branding) == null ? void 0 : O.images) == null ? void 0 : W.mainLogo) || "" : ((K = (M = e.poll.branding) == null ? void 0 : M.images) == null ? void 0 : K.mainLogo) || "", f = e.imagePosition || "left", k = ie(
     {
       images: e.poll.images,
       imagePlaceholder: e.defaultImagePlaceholderUrl ? e.defaultImagePlaceholderUrl : ""
@@ -1219,7 +1220,7 @@ const Vt = (e) => {
             startGame: z,
             contentId: e.poll.id,
             contentName: e.poll.title,
-            brandingColors: (j = e.poll.branding) == null ? void 0 : j.colors,
+            brandingColors: (E = e.poll.branding) == null ? void 0 : E.colors,
             brandingUrls: (q = e.poll.branding) == null ? void 0 : q.urls,
             campaignId: (w = e.leads) == null ? void 0 : w.campaignId,
             campaignName: (te = e.leads) == null ? void 0 : te.campaignName,
@@ -1603,7 +1604,7 @@ const Vt = (e) => {
     }
   };
 }, Nt = (e) => {
-  var M, K, Q, j, q, w, te, oe, ae, re, ce, se, de, ge, ne, me, ue, fe, xe, ye, ve, Fe;
+  var M, K, Q, E, q, w, te, oe, ae, re, ce, se, de, ge, ne, me, ue, fe, xe, ye, ve, Fe;
   const [n, o] = Ie.useState(
     ((M = e.leads) == null ? void 0 : M.position) === "before" && e.poll.authRequirement === "LEAD"
   );
@@ -1619,7 +1620,7 @@ const Vt = (e) => {
       imagePlaceholder: u
     },
     V.SPLIT
-  ), y = ke(e.options), { t: d } = G(), m = ((Q = e.poll.branding) == null ? void 0 : Q.colors) || null, f = c ? ((j = e.poll.branding) == null ? void 0 : j.images.mobileLogo) || ((q = e.poll.branding) == null ? void 0 : q.images.mainLogo) || "" : ((w = e.poll.branding) == null ? void 0 : w.images.mainLogo) || "", k = Ee(e.poll.embedCode), I = !n && !!e.poll.embedCode, r = ((te = e.leads) == null ? void 0 : te.position) === "after" ? d("poll.buttons.continue") : d("poll.buttons.vote"), A = (m == null ? void 0 : m.contentColor) || F().textColor, S = _().secondary, b = "60%", P = _().primary, D = Y().xl, T = (m == null ? void 0 : m.backgroundColor) || F().surfaceVariant, C = (m == null ? void 0 : m.primaryColor) || ((ae = (oe = F().palette) == null ? void 0 : oe.primary) == null ? void 0 : ae.plainColor), z = (ce = (re = F().palette) == null ? void 0 : re.primary) == null ? void 0 : ce.onPrimary, L = F().textColor, v = ee(), H = Y(), E = ze(
+  ), y = ke(e.options), { t: d } = G(), m = ((Q = e.poll.branding) == null ? void 0 : Q.colors) || null, f = c ? ((E = e.poll.branding) == null ? void 0 : E.images.mobileLogo) || ((q = e.poll.branding) == null ? void 0 : q.images.mainLogo) || "" : ((w = e.poll.branding) == null ? void 0 : w.images.mainLogo) || "", k = je(e.poll.embedCode), I = !n && !!e.poll.embedCode, r = ((te = e.leads) == null ? void 0 : te.position) === "after" ? d("poll.buttons.continue") : d("poll.buttons.vote"), A = (m == null ? void 0 : m.contentColor) || F().textColor, S = _().secondary, b = "60%", P = _().primary, D = Y().xl, T = (m == null ? void 0 : m.backgroundColor) || F().surfaceVariant, C = (m == null ? void 0 : m.primaryColor) || ((ae = (oe = F().palette) == null ? void 0 : oe.primary) == null ? void 0 : ae.plainColor), z = (ce = (re = F().palette) == null ? void 0 : re.primary) == null ? void 0 : ce.onPrimary, L = F().textColor, v = ee(), H = Y(), j = ze(
     V.SPLIT
   ), U = Ce(T || ""), R = $t({
     finalImage: g,
@@ -1636,7 +1637,7 @@ const Vt = (e) => {
     textColor: L,
     brandingColors: m,
     darkTextColor: s.colorSchemes.dark.textColor,
-    imageBackgroundGradient: E,
+    imageBackgroundGradient: j,
     isLarge: a
   }), O = () => {
     o(!1);
@@ -1806,7 +1807,7 @@ const Vt = (e) => {
     }
   );
 }, Gt = (e) => {
-  const n = Y(), o = N(), i = je().size, s = F(), c = _(), a = s.palette.primary.plainColor, u = s.textPrimary, g = s.textSecondary, y = s.secondaryContainer, d = s.surface, m = s.onSurface, f = `rgba(${Ce(s.surfaceVariant)}, 0.5)`;
+  const n = Y(), o = N(), i = Ee().size, s = F(), c = _(), a = s.palette.primary.plainColor, u = s.textPrimary, g = s.textSecondary, y = s.secondaryContainer, d = s.surface, m = s.onSurface, f = `rgba(${Ce(s.surfaceVariant)}, 0.5)`;
   return {
     // Question area
     questionArea: {
@@ -1959,11 +1960,11 @@ const Vt = (e) => {
 }, pt = (e, n) => {
   switch (e) {
     case "success":
-      return /* @__PURE__ */ t(Ft, {});
+      return /* @__PURE__ */ t(At, {});
     case "error":
-      return /* @__PURE__ */ t(vt, { sx: { color: n } });
+      return /* @__PURE__ */ t(Ft, { sx: { color: n } });
     case "info":
-      return /* @__PURE__ */ t(kt, {});
+      return /* @__PURE__ */ t(vt, {});
   }
 }, _t = (e) => {
   switch (e) {
@@ -1982,7 +1983,7 @@ const Vt = (e) => {
 }) => {
   const s = Z(), c = Y(), a = _().secondary, u = _t(e);
   return /* @__PURE__ */ t(
-    At,
+    Pt,
     {
       variant: "soft",
       color: u,
@@ -1997,7 +1998,7 @@ const Vt = (e) => {
         "--Icon-fontSize": "1.25em"
       },
       children: /* @__PURE__ */ x(
-        Pt,
+        kt,
         {
           sx: {
             fontSize: "1.5em"
@@ -2281,7 +2282,7 @@ const Vt = (e) => {
     e.option.id
   );
 }, Ke = (e) => {
-  const { t: n } = G(), o = ee(), i = F(), s = _(), c = je().size, u = e.options.reduce(
+  const { t: n } = G(), o = ee(), i = F(), s = _(), c = Ee().size, u = e.options.reduce(
     (g, y) => g + (y.votes || 0),
     0
   );
@@ -2772,14 +2773,14 @@ const Vt = (e) => {
     p: e.spacingScale.lg
   }
 }), Qt = (e) => {
-  var L, v, H, E;
+  var L, v, H, j;
   const n = Z(), o = N(), i = st(), s = We(), c = e.defaultImagePlaceholderUrl ? e.defaultImagePlaceholderUrl : o ? he : be, a = ie(
     {
       images: e.poll.images,
       imagePlaceholder: c
     },
     V.SPLIT
-  ), u = ke(e.poll.options), { t: g } = G(), { optionsLayout: y } = Te(Ae), d = ((L = e.poll.branding) == null ? void 0 : L.colors) || null, m = F().textPrimary, f = (d == null ? void 0 : d.secondaryColor) || F().textSecondary, k = F().secondaryContainer, I = _().primary, r = (d == null ? void 0 : d.backgroundColor) || F().surfaceVariant, A = F().surface, S = F().onSurface, b = Y(), P = F().textColor, D = ee(), T = o ? ((v = e.poll.branding) == null ? void 0 : v.images.mobileLogo) || ((H = e.poll.branding) == null ? void 0 : H.images.mainLogo) || "" : ((E = e.poll.branding) == null ? void 0 : E.images.mainLogo) || "", C = Kt({
+  ), u = ke(e.poll.options), { t: g } = G(), { optionsLayout: y } = Te(Ae), d = ((L = e.poll.branding) == null ? void 0 : L.colors) || null, m = F().textPrimary, f = (d == null ? void 0 : d.secondaryColor) || F().textSecondary, k = F().secondaryContainer, I = _().primary, r = (d == null ? void 0 : d.backgroundColor) || F().surfaceVariant, A = F().surface, S = F().onSurface, b = Y(), P = F().textColor, D = ee(), T = o ? ((v = e.poll.branding) == null ? void 0 : v.images.mobileLogo) || ((H = e.poll.branding) == null ? void 0 : H.images.mainLogo) || "" : ((j = e.poll.branding) == null ? void 0 : j.images.mainLogo) || "", C = Kt({
     spacingScale: D,
     borderRadius: b,
     fontFamilyPrimary: I,
@@ -3567,8 +3568,8 @@ const Vt = (e) => {
     primaryColor: d,
     onPrimaryColor: m
   }), D = () => {
-    var H, E, U, R;
-    return e.signInCTA ? (H = e.signInCTA) != null && H.component ? e.signInCTA.component : (E = e.signInCTA) != null && E.onClick ? /* @__PURE__ */ t(
+    var H, j, U, R;
+    return e.signInCTA ? (H = e.signInCTA) != null && H.component ? e.signInCTA.component : (j = e.signInCTA) != null && j.onClick ? /* @__PURE__ */ t(
       p,
       {
         variant: "soft",
@@ -3834,7 +3835,7 @@ const Vt = (e) => {
     alignItems: "center"
   }
 }), dn = (e) => {
-  var S, b, P, D, T, C, z, L, v, H, E;
+  var S, b, P, D, T, C, z, L, v, H, j;
   const n = Z(), { t: o } = G(), i = N(), s = ze(
     V.OVERLAY
   ), { brandingImage: c, brandingColors: a, brandingLogo: u } = Ve(e.poll.branding || null), g = e.defaultImagePlaceholderUrl ? e.defaultImagePlaceholderUrl : i ? he : be, y = c || ie(
@@ -3927,7 +3928,7 @@ const Vt = (e) => {
         {
           brandingLogo: u,
           textColor: n.colorSchemes.dark.textColor,
-          label: ((E = e.poll.labels) == null ? void 0 : E.sponsor) || null
+          label: ((j = e.poll.labels) == null ? void 0 : j.sponsor) || null
         }
       )
     }
@@ -4042,7 +4043,7 @@ const fn = (e) => {
         rulesDisplay: e.rulesDisplay
       }
     );
-  const E = () => {
+  const j = () => {
     C(!1), z(""), L(!1), g(!u);
   };
   if (P || D)
@@ -4054,7 +4055,7 @@ const fn = (e) => {
         defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
         isApiError: D,
         apiErrorMessage: T,
-        toggleTryAgain: E,
+        toggleTryAgain: j,
         rulesDisplay: e.rulesDisplay
       }
     ) : e.template === V.OVERLAY ? /* @__PURE__ */ t(
@@ -4064,7 +4065,7 @@ const fn = (e) => {
         defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
         isApiError: D,
         apiErrorMessage: T,
-        toggleTryAgain: E,
+        toggleTryAgain: j,
         rulesDisplay: e.rulesDisplay
       }
     ) : /* @__PURE__ */ t(
@@ -4074,20 +4075,20 @@ const fn = (e) => {
         defaultImagePlaceholderUrl: e.defaultImagePlaceholderUrl,
         isApiError: D,
         apiErrorMessage: T,
-        toggleTryAgain: E,
+        toggleTryAgain: j,
         rulesDisplay: e.rulesDisplay
       }
     );
-  const U = r.multipleChoice && r.maxMultipleChoiceOptions || 1, R = (j) => {
+  const U = r.multipleChoice && r.maxMultipleChoiceOptions || 1, R = (E) => {
     if (U === 1)
-      o(j);
+      o(E);
     else {
-      const q = j[0];
+      const q = E[0];
       o((w) => w.includes(q) ? w.filter((te) => te !== q) : w.length < U ? [...w, q] : w);
     }
   }, O = async () => {
-    var j;
-    if (((j = e.leads) == null ? void 0 : j.position) === "after" && r.authRequirement === "LEAD" && !m) {
+    var E;
+    if (((E = e.leads) == null ? void 0 : E.position) === "after" && r.authRequirement === "LEAD" && !m) {
       I(!0);
       return;
     }
@@ -4095,20 +4096,20 @@ const fn = (e) => {
   }, W = async () => {
     a(!0);
     try {
-      const j = await e.sdk.voting.voteForPoll(
+      const E = await e.sdk.voting.voteForPoll(
         e.entityId,
         n
       ), q = { ...r };
       q.options = r.options.map((w) => n.includes(w.id) ? {
         ...w,
         votes: w.votes + 1
-      } : w), q.totalVotes = (r.totalVotes || 0) + n.length, A(q), b(j), s(!0);
-    } catch (j) {
+      } : w), q.totalVotes = (r.totalVotes || 0) + n.length, A(q), b(E), s(!0);
+    } catch (E) {
       if (e.sdk.helpers.getSDKConfiguration().errorHandlingMode === "standard") {
-        const w = j;
+        const w = E;
         w.error.code === 401 || w.error.code === 403 ? L(!0) : (C(!0), z(w.error.message));
       } else {
-        const w = j;
+        const w = E;
         w.data.error.code === 401 || w.data.error.code === 403 ? L(!0) : (C(!0), z(w.data.error.message));
       }
     } finally {
@@ -4119,7 +4120,7 @@ const fn = (e) => {
   }, K = () => {
     s(!1), o([]), d(!1), f(!1), I(!1);
   }, Q = () => e.template === V.OVERLAY ? /* @__PURE__ */ t(
-    Et,
+    jt,
     {
       sdk: e.sdk,
       leads: e.leads,
@@ -4199,7 +4200,7 @@ const fn = (e) => {
       }
     );
   if (i || v) {
-    const j = H ? /* @__PURE__ */ t(Ze, { entityId: H, sdk: e.sdk, children: (w) => /* @__PURE__ */ t(et, { infoPage: w, variant: e.chanceGameVariant }) }) : void 0, q = H ? /* @__PURE__ */ t(Ze, { entityId: H, sdk: e.sdk, children: (w) => /* @__PURE__ */ t(et, { infoPage: w, variant: e.chanceGameVariant, forceMobile: !0 }) }) : void 0;
+    const E = H ? /* @__PURE__ */ t(Ze, { entityId: H, sdk: e.sdk, children: (w) => /* @__PURE__ */ t(et, { infoPage: w, variant: e.chanceGameVariant }) }) : void 0, q = H ? /* @__PURE__ */ t(Ze, { entityId: H, sdk: e.sdk, children: (w) => /* @__PURE__ */ t(et, { infoPage: w, variant: e.chanceGameVariant, forceMobile: !0 }) }) : void 0;
     return e.template === V.OVERLAY ? /* @__PURE__ */ t(
       Xt,
       {
@@ -4213,7 +4214,7 @@ const fn = (e) => {
         isUnauthorized: P,
         additionalCTA: e.additionalCTA,
         rulesDisplay: e.rulesDisplay,
-        chanceGameContent: j
+        chanceGameContent: E
       }
     ) : Se(e) ? /* @__PURE__ */ t(
       Yt,
@@ -4249,7 +4250,7 @@ const fn = (e) => {
     );
   }
   return Q();
-}, xn = (e) => /* @__PURE__ */ t(gt, { packageName: "poll-vote", ...e, children: /* @__PURE__ */ t(fn, { ...e }) }), Ln = xn;
+}, xn = (e) => /* @__PURE__ */ t(gt, { packageName: "poll-vote", ...e, children: /* @__PURE__ */ t(fn, { ...e }) }), Rn = xn;
 export {
-  Ln as PollVote
+  Rn as PollVote
 };

package/README.md

@@ -130,6 +130,7 @@ const themeOptions: CustomThemeOptions = {
       },
       textPrimary: "#212121",
       textSecondary: "#212121",
+      textBody: "#424242",
       textColor: "#212121",
       textDisabled: "#212121",
       surface: "#FFFFFF",
@@ -165,6 +166,7 @@ const themeOptions: CustomThemeOptions = {
       },
       textPrimary: "#FAFAFA",
       textSecondary: "#FAFAFA",
+      textBody: "#FAFAFA",
       textColor: "#FAFAFA",
       textDisabled: "#FAFAFA",
       surface: "#424242",
@@ -2207,6 +2209,234 @@ import { WidgetTemplate } from "fansunited-frontend-core";
 />
 ```
 
+### Discussion
+
+Interactive discussion/commenting component that enables threaded conversations on any piece of content. Features real-time post creation, nested replies, reactions, reporting, moderation awareness, and multi-language support.
+
+**Key Features:**
+
+- Threaded 2-level comments (posts and replies)
+- Four sort modes: Latest, Oldest, Popular, Most Replied
+- Cursor-based pagination with configurable posts-per-page
+- Post reporting with reason and optional details
+- Delete own posts with confirmation dialog
+- Authentication-aware UI (sign-in prompt for unauthenticated users)
+- Moderated and deleted post handling
+- Custom theming and multi-language support
+
+#### Required Props
+
+| Prop               | Type                 | Description                                                    |
+| ------------------ | -------------------- | -------------------------------------------------------------- |
+| `entityId`         | `string`             | Unique identifier for this discussion (e.g. article ID)        |
+| `sdk`              | `FansUnitedSDKModel` | SDK instance                                                   |
+| `language`         | `LanguageType`       | Display language                                               |
+
+#### Optional Props
+
+| Prop              | Type                   | Default      | Description                                             |
+| ----------------- | ---------------------- | ------------ | ------------------------------------------------------- |
+| `themeOptions`    | `CustomThemeOptions`   | —            | Theme configuration                                     |
+| `discussionLabel` | `string`               | —            | Title/label used when the discussion is created for the first time |
+| `discussionUrl`   | `string`               | —            | URL associated with the discussion content              |
+| `defaultSort`     | `DiscussionSortType`   | `"LATEST"`   | Initial sort order for posts                            |
+| `postsPerPage`    | `number`               | `20`         | Number of posts loaded per page                         |
+| `showReactions`      | `boolean`              | `true`       | Show/hide reaction buttons on posts                     |
+| `showReplies`        | `boolean`              | `true`       | Enable/disable reply functionality                      |
+| `showReportPost`     | `boolean`              | `true`       | Show/hide the report option in the post menu            |
+| `showModeratedPosts` | `boolean`              | `false`      | When `true`, moderated posts are fetched and displayed with a masked design — the original content is replaced by the moderation reason |
+| `infiniteScroll`     | `boolean`              | `false`      | Load more posts automatically on scroll instead of showing a "Load More" button |
+| `userIsLoggedIn`  | `boolean`              | `false`      | Whether the current user is authenticated               |
+| `onSignInClick`   | `() => void`           | —            | Callback triggered when the sign-in prompt is clicked   |
+
+#### Sort Modes
+
+```tsx
+import { DiscussionSortType } from "fansunited-frontend-core";
+
+// Sort options
+type DiscussionSortType = "LATEST" | "OLDEST" | "POPULAR" | "INTERACTED";
+//                         ^newest   ^oldest   ^most       ^most
+//                          first    first     reactions   replies
+```
+
+#### Authentication & Sign-in
+
+Control user access and the sign-in prompt using the `userIsLoggedIn` and `onSignInClick` props.
+
+```tsx
+<Discussion
+  {...otherProps}
+  userIsLoggedIn={false}
+  onSignInClick={() => {
+    // Handle sign-in navigation or modal
+    console.log("Sign in clicked");
+  }}
+/>
+```
+
+**Behavior:**
+
+- When `userIsLoggedIn` is `false`, the post composer is replaced with a sign-in prompt
+- Reactions, replies, and delete/report actions are also gated behind authentication
+- Passing `onSignInClick` makes the sign-in button active; omitting it renders a disabled button
+
+#### Reactions
+
+Eight reaction types are available when `showReactions={true}` (the default):
+
+```tsx
+// Reaction types available on every post
+type ReactionType = "LIKE" | "DISLIKE" | "LOVE" | "LAUGH" | "CARE" | "WOW" | "SAD" | "ANGRY";
+```
+
+Users can toggle their reaction by clicking an emoji. Re-clicking the same reaction removes it. Only authenticated users can react.
+
+#### Theming
+
+Customize the appearance using the same `CustomThemeOptions` interface shared across all components:
+
+```tsx
+import { CustomThemeOptions } from "fansunited-frontend-core";
+
+const themeOptions: CustomThemeOptions = {
+  mode: "dark",
+  colorSchemes: {
+    dark: {
+      surface: "#1a1a1a",
+      surfaceVariant: "#2a2a2a",
+      outlineEnabledBorder: "#3a3a3a",
+      textPrimary: "#FAFAFA",
+      textSecondary: "#9E9E9E",
+      textBody: "#E0E0E0",
+      palette: {
+        primary: {
+          plainColor: "#1A77D2",
+          onPrimary: "#FAFAFA",
+        },
+      },
+    },
+  },
+};
+
+<Discussion {...otherProps} themeOptions={themeOptions} />;
+```
+
+#### TypeScript Support
+
+Import types from `fansunited-frontend-core`:
+
+```tsx
+import {
+  DiscussionProps,
+  DiscussionSortType,
+  CustomThemeOptions,
+  LanguageType,
+} from "fansunited-frontend-core";
+```
+
+#### Examples
+
+##### Basic Discussion
+
+```tsx
+import { Discussion } from "fansunited-frontend-components";
+
+<Discussion
+  entityId="article-123"
+  sdk={sdkInstance}
+  language="en"
+  discussionLabel="Liverpool vs Man City — Match Reaction"
+/>;
+```
+
+##### Authenticated User with All Features
+
+```tsx
+<Discussion
+  entityId="article-123"
+  sdk={sdkInstance}
+  language="en"
+  discussionLabel="Liverpool vs Man City — Match Reaction"
+  discussionUrl="https://your-site.com/articles/liverpool-vs-man-city"
+  userIsLoggedIn={true}
+  defaultSort="POPULAR"
+  postsPerPage={10}
+  showReactions={true}
+  showReplies={true}
+  showReportPost={true}
+  themeOptions={{
+    mode: "light",
+  }}
+/>
+```
+
+##### Show Moderated Posts
+
+Fetch and display moderated comments with a masked design. The original content is replaced by the moderation reason (or a localised fallback). All other post elements — avatar, username, timestamp, reactions, and reply button — remain visible.
+
+```tsx
+<Discussion
+  entityId="article-123"
+  sdk={sdkInstance}
+  language="en"
+  discussionLabel="Post Comments"
+  userIsLoggedIn={true}
+  showModeratedPosts={true}
+/>
+```
+
+##### Minimal Read-Only Style
+
+Disable reactions, replies, and reporting for a simplified read-only-like experience:
+
+```tsx
+<Discussion
+  entityId="article-123"
+  sdk={sdkInstance}
+  language="en"
+  discussionLabel="Post Comments"
+  userIsLoggedIn={false}
+  showReactions={false}
+  showReplies={false}
+  showReportPost={false}
+  onSignInClick={() => openSignInModal()}
+/>
+```
+
+##### Dark Theme with Sign-in Integration
+
+```tsx
+<Discussion
+  entityId="match-456"
+  sdk={sdkInstance}
+  language="en"
+  discussionLabel="Match Day Chat"
+  userIsLoggedIn={isUserLoggedIn}
+  onSignInClick={() => router.push("/login")}
+  defaultSort="LATEST"
+  postsPerPage={20}
+  themeOptions={{
+    mode: "dark",
+    colorSchemes: {
+      dark: {
+        surface: "#212121",
+        textPrimary: "#FAFAFA",
+        palette: {
+          primary: {
+            plainColor: "#2397F3",
+            primaryContainer: "#1A77D2",
+            onPrimary: "#FFFFFF",
+          },
+        },
+      },
+    },
+  }}
+/>
+```
+
+---
+
 ### ChanceGame
 
 Interactive chance-based game component featuring three distinct game variants — Prize Wheel, Penalty Shootout, and Pick One of X. Driven entirely by InfoPage configuration, it supports flexible selection modes, configurable animation speed, per-segment result screens with CTAs, and optional visual decorations.
@@ -2513,6 +2743,7 @@ This package exports the following components:
 - **`MatchQuizPlay`** - Football match prediction quiz with multiple markets
 - **`EventGamePlay`** - Event prediction game with flexible outcome types
 - **`ChanceGame`** - Chance-based game with Prize Wheel, Penalty Shootout, and Pick One of X variants
+- **`Discussion`** - Threaded comments with reactions, replies, reporting, and authentication support
 
 ## Related Packages