import { jsx as e, jsxs as d, Fragment as z } from "react/jsx-runtime";
import { useState as b, useRef as ee, useEffect as H, useCallback as j, useLayoutEffect as Ue, useMemo as _ } from "react";
import { s as n, c as ue } from "./sl-types.js";
import { i as le } from "./index8.js";
import { B as w } from "./index4.js";
import { Q as i, a as J, c as se, b as Ke } from "./useStreamLayerApp2.js";
import { O as _e, L as He } from "./index10.js";
import { d as Ee } from "./index3.js";
const Qn = /* @__PURE__ */ n("div")({
  name: "SDKContainer",
  class: "sopqfe6",
  propsAsIs: !1
}), Ge = /* @__PURE__ */ n("div")({
  name: "SDKScrollContainer",
  class: "s102vcph",
  propsAsIs: !1
}), be = /* @__PURE__ */ n("div")({
  name: "SDKContentContainer",
  class: "s1meqjjv",
  propsAsIs: !1
}), Je = () => be, we = /* @__PURE__ */ n(Je())({
  name: "SDKWhiteContainer",
  class: "s1burm22",
  propsAsIs: !0
}), Xe = () => we, Fn = /* @__PURE__ */ n(Xe())({
  name: "SDKSummaryContainer",
  class: "sm5r3j5",
  propsAsIs: !0
}), Wn = /* @__PURE__ */ n("div")({
  name: "TabsContainer",
  class: "tysxwr6",
  propsAsIs: !1
}), Ze = () => be, Bn = /* @__PURE__ */ n(Ze())({
  name: "LeaderboardContainer",
  class: "l9er3b1",
  propsAsIs: !0
}), es = () => we, Yn = /* @__PURE__ */ n(es())({
  name: "TabsNavContainer",
  class: "t19dtrb3",
  propsAsIs: !0
}), zn = /* @__PURE__ */ n("div")({
  name: "UserSummaryContainer",
  class: "u1552n3j",
  propsAsIs: !1
});
var ss = Object.defineProperty, ns = (s, t, r) => t in s ? ss(s, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : s[t] = r, ts = (s, t, r) => ns(s, t + "", r);
let is = class {
  constructor() {
    ts(this, "observers", /* @__PURE__ */ new Set());
  }
  subscribe(t) {
    this.observers.add(t);
  }
  unsubscribe(t) {
    this.observers.delete(t);
  }
  notify(t) {
    this.observers.forEach((r) => r(t));
  }
};
const X = new is(), rs = { hiding: !1, finished: !1 }, os = () => {
  const [s, t] = b(rs), r = ee(null);
  H(() => {
    const p = (h) => {
      t(h);
    };
    return X.subscribe(p), () => {
      X.unsubscribe(p);
    };
  }, []);
  const l = j((p) => {
    const h = { hiding: !0, finished: !1 };
    r.current && clearTimeout(r.current), p != null && p.delay ? r.current = setTimeout(() => {
      X.notify(h);
    }, p == null ? void 0 : p.delay) : X.notify(h);
  }, []), o = j(() => {
    s.hiding && (r.current = null, X.notify({ hiding: !1, finished: !0 }));
  }, [s.hiding]);
  return {
    ...s,
    runAnimation: l,
    onAnimationEnd: o
  };
}, as = /* @__PURE__ */ n("div")({
  name: "Container",
  class: "c1pgyo67",
  propsAsIs: !1
}), cs = "sx17qu6", ds = "h1692c5m", ge = ({
  children: s,
  style: t,
  className: r,
  enabled: l = !0,
  hiding: o,
  onAnimationEnd: p
}) => /* @__PURE__ */ e(as, {
  style: t,
  className: ue(r, l && cs, l && o && ds),
  onAnimationEnd: p,
  children: s
}), ls = () => ge, ps = /* @__PURE__ */ n(ls())({
  name: "GrowingContainer",
  class: "gck55ev",
  propsAsIs: !0
}), Pe = ({
  children: s,
  style: t,
  enabled: r,
  animate: l,
  ...o
}) => {
  const p = ee(null);
  return /* @__PURE__ */ e(ps, {
    ...o,
    enabled: r && l,
    style: {
      ...t,
      ...(() => {
        const h = p == null ? void 0 : p.current, f = h && window.getComputedStyle(h), P = f == null ? void 0 : f.getPropertyValue("height");
        return r ? {
          height: l ? P : 0
        } : {};
      })()
    },
    children: /* @__PURE__ */ e("div", {
      ref: p,
      children: s
    })
  });
}, us = /* @__PURE__ */ n("div")({
  name: "Container",
  class: "c1gcvmcj",
  propsAsIs: !1
}), ms = /* @__PURE__ */ n("div")({
  name: "Title",
  class: "tnr592a",
  propsAsIs: !1
}), hs = /* @__PURE__ */ n("div")({
  name: "Description",
  class: "d1e8jqpv",
  propsAsIs: !1
}), Is = () => w, vs = /* @__PURE__ */ n(Is())({
  name: "Icon",
  class: "i1vs651k",
  propsAsIs: !0
}), As = ({ icon: s, title: t, description: r }) => /* @__PURE__ */ d(us, { children: [
  /* @__PURE__ */ e(vs, { name: s }),
  /* @__PURE__ */ e(ms, { children: t }),
  /* @__PURE__ */ e(hs, { children: r })
] }), ys = () => Pe, fs = /* @__PURE__ */ n(ys())({
  name: "ShowInContainer",
  class: "s16sbdnm",
  propsAsIs: !0
}), B = /* @__PURE__ */ n("div")({
  name: "FeedbackContainer",
  class: "fbhorgl",
  propsAsIs: !1
}), ye = "s1g20ja7", Cs = /* @__PURE__ */ n("div")({
  name: "Container",
  class: "c455ozj",
  propsAsIs: !1
}), Ts = () => w, fe = /* @__PURE__ */ n(Ts())({
  name: "IconPrediction",
  class: "i1913njx",
  propsAsIs: !0
}), Z = /* @__PURE__ */ n("div")({
  name: "FeedbackIconWrap",
  class: "fzfk69z",
  propsAsIs: !1
}), ie = /* @__PURE__ */ n("div")({
  name: "FeedbackHeader",
  class: "fx87qaj",
  propsAsIs: !1
}), $s = /* @__PURE__ */ n("span")({
  name: "FeedbackTitle",
  class: "fvek9ew",
  propsAsIs: !1
}), Y = /* @__PURE__ */ n("span")({
  name: "FeedbackDescription",
  class: "f1kbtp09",
  propsAsIs: !1
}), Es = /* @__PURE__ */ n("div")({
  name: "FeedbackTitleWrap",
  class: "f4i8rro",
  propsAsIs: !1
}), bs = /* @__PURE__ */ n("div")({
  name: "FeedbackResultDescriptionWrap",
  class: "fqyssr",
  propsAsIs: !1
}), ws = () => Y, gs = /* @__PURE__ */ n(ws())({
  name: "FeedbackDynamicDescription",
  class: "fyv794i",
  propsAsIs: !0
}), Ps = () => Y, Rs = /* @__PURE__ */ n(Ps())({
  name: "FeedbackResultDescription",
  class: "f1jkj9vx",
  propsAsIs: !0
}), pe = /* @__PURE__ */ n("div")({
  name: "FeedbackText",
  class: "f1pxh3a6",
  propsAsIs: !1
}), Ds = /* @__PURE__ */ n("span")({
  name: "DynamicWrap",
  class: "d1afvufn",
  propsAsIs: !1
}), qs = /* @__PURE__ */ n("div")({
  name: "EarlyFeedbackDescription",
  class: "eq8u24d",
  propsAsIs: !1
}), Ce = ({
  feedbackMessages: s,
  questionVotedCorrectly: t,
  questionVoted: r,
  questionType: l,
  hasCorrectAnswer: o,
  showExpiredNotification: p,
  showClosedNotificationTrivia: h,
  votedInCurrentRender: f,
  votedAfterQuestionClosed: P,
  voteErrorMessage: I,
  enteredAnActiveQuestion: a,
  marketClosed: R,
  percentsAnimated: E,
  votedAnswer: y,
  isEarlyPrediction: m,
  correctAnswer: q,
  onAnimationEnd: x
}) => {
  const g = r && (l === i.TRIVIA || l === i.PREDICTION), T = l === i.PREDICTION && !o, N = R && l === i.PREDICTION && !r || l === i.PREDICTION && P && f && a, k = g && T, S = g && o, D = l === i.PREDICTION && r && f && o, O = r && l === i.POLL && f, v = t ? "correct" : "incorrect", V = t ? s == null ? void 0 : s.correctFeedback : s == null ? void 0 : s.incorrectFeedback;
  return p || h || k || S || N || O || D || I ? /* @__PURE__ */ e(
    fs,
    {
      enabled: f,
      animate: !I && p ? !0 : E,
      onAnimationEnd: x,
      children: /* @__PURE__ */ d(Cs, { "data-prediction": T, children: [
        I && !N && /* @__PURE__ */ d(B, { children: [
          !m && /* @__PURE__ */ e(fe, { name: "questionExpired" }),
          /* @__PURE__ */ e(Y, { children: I })
        ] }),
        !I && p && /* @__PURE__ */ d(B, { children: [
          !m && /* @__PURE__ */ e(Z, { children: /* @__PURE__ */ e(w, { name: "questionExpired" }) }),
          /* @__PURE__ */ d("div", { children: [
            /* @__PURE__ */ e(ie, { children: /* @__PURE__ */ e(Y, { children: "Question Expired" }) }),
            /* @__PURE__ */ e(pe, { children: "You can still answer to see if you're correct, but no points are awarded for expired questions." })
          ] })
        ] }),
        !I && h && /* @__PURE__ */ d(B, { className: ue(ye), children: [
          /* @__PURE__ */ e(Z, { children: /* @__PURE__ */ e(w, { name: "questionExpired" }) }),
          /* @__PURE__ */ d("div", { children: [
            /* @__PURE__ */ e(ie, { children: /* @__PURE__ */ e(Y, { children: "Question Closed" }) }),
            /* @__PURE__ */ e(pe, { children: "This question was answered after the moderator closed the question. So the points for this answer won’t tally." })
          ] })
        ] }),
        N && /* @__PURE__ */ d(B, { children: [
          !m && /* @__PURE__ */ e(Z, { children: /* @__PURE__ */ e(w, { name: "questionExpired" }) }),
          /* @__PURE__ */ d("div", { children: [
            /* @__PURE__ */ e(ie, { children: /* @__PURE__ */ e(Y, { children: m ? o ? "The results are already in!" : "Question is Closed" : "Question Closed" }) }),
            /* @__PURE__ */ e(pe, { children: m ? /* @__PURE__ */ e(qs, { children: o ? `Correct: ${q == null ? void 0 : q.text}` : "Event affecting the outcome has occurred." }) : "This event has already taken place, so the ability to make a prediction on its outcome is no longer available." })
          ] })
        ] }),
        !I && k && /* @__PURE__ */ d(B, { children: [
          !m && /* @__PURE__ */ e(fe, { name: "icon-prediction" }),
          /* @__PURE__ */ d(gs, { children: [
            "Your pick has been recorded. ",
            /* @__PURE__ */ e(Ds, { children: "We’ll notify you of the result." })
          ] })
        ] }),
        !I && O && /* @__PURE__ */ d(B, { children: [
          !m && /* @__PURE__ */ e(Z, { "data-feedback-type": "correct", children: /* @__PURE__ */ e(w, { name: "correct" }) }),
          /* @__PURE__ */ e(Y, { children: "Thanks for answering. Please stay tuned for the next question." })
        ] }),
        !I && (S || D) && /* @__PURE__ */ d(B, { className: ue(h && ye), children: [
          !m && /* @__PURE__ */ e(Z, { "data-feedback-type": v, children: /* @__PURE__ */ e(w, { name: v }) }),
          /* @__PURE__ */ e("div", { children: /* @__PURE__ */ d(ie, { children: [
            m ? /* @__PURE__ */ e(Es, { children: v === "incorrect" ? /* @__PURE__ */ d(z, { children: [
              /* @__PURE__ */ e("div", { children: "So close!" }),
              /* @__PURE__ */ e("div", { children: "Better luck next time" })
            ] }) : /* @__PURE__ */ d(z, { children: [
              /* @__PURE__ */ e("div", { children: "That’s correct!" }),
              /* @__PURE__ */ e("div", { children: "You chose wisely." })
            ] }) }) : /* @__PURE__ */ e($s, { "data-feedback-type": v, children: V == null ? void 0 : V.title }),
            m ? /* @__PURE__ */ d(bs, { children: [
              /* @__PURE__ */ d("div", { children: [
                "Your pick: ",
                y == null ? void 0 : y.text
              ] }),
              /* @__PURE__ */ e("div", { children: v === "incorrect" ? `Correct: ${q == null ? void 0 : q.text}` : "" })
            ] }) : /* @__PURE__ */ e(Rs, { children: V == null ? void 0 : V.description })
          ] }) })
        ] })
      ] })
    }
  ) : null;
}, xs = /* @__PURE__ */ n("div")({
  name: "Container",
  class: "c1hygj0s",
  propsAsIs: !1
}), ks = /* @__PURE__ */ n("div")({
  name: "Title",
  class: "t1r84tez",
  propsAsIs: !1
}), Os = /* @__PURE__ */ n("div")({
  name: "Description",
  class: "d1aj1a7k",
  propsAsIs: !1
}), Ns = /* @__PURE__ */ n("div")({
  name: "AdditionalDescription",
  class: "ax09ezs",
  propsAsIs: !1
}), Ss = () => w, Vs = /* @__PURE__ */ n(Ss())({
  name: "Icon",
  class: "inkrac",
  propsAsIs: !0
}), js = ({ icon: s, title: t, description: r, additionalDescription: l }) => /* @__PURE__ */ d(xs, { children: [
  s && /* @__PURE__ */ e(Vs, { name: s }),
  /* @__PURE__ */ e(ks, { children: t }),
  /* @__PURE__ */ e(Os, { children: r }),
  l && /* @__PURE__ */ e(Ns, { children: l })
] }), Re = /* @__PURE__ */ n("div")({
  name: "Container",
  class: "c14ielyq",
  propsAsIs: !1
}), Ls = () => Ge, Qs = /* @__PURE__ */ n(Ls())({
  name: "QuestionScrollContainer",
  class: "q1tlqx57",
  propsAsIs: !0
}), Fs = /* @__PURE__ */ n("div")({
  name: "TopShadow",
  class: "t1hq58md",
  propsAsIs: !1
}), Ws = /* @__PURE__ */ n("div")({
  name: "BottomShadow",
  class: "b1c8nxcx",
  propsAsIs: !1
}), Bs = /* @__PURE__ */ n("div")({
  name: "SponsorLogo",
  class: "siozuc3",
  propsAsIs: !1
}), De = /* @__PURE__ */ n("div")({
  name: "Content",
  class: "cpnc44r",
  propsAsIs: !1
}), Ys = /* @__PURE__ */ n("div")({
  name: "Title",
  class: "tq7p3w0",
  propsAsIs: !1
}), zs = /* @__PURE__ */ n("div")({
  name: "OptionsWrap",
  class: "o1jlfj9g",
  propsAsIs: !1
}), qe = /* @__PURE__ */ n("div")({
  name: "Options",
  class: "o84pmnd",
  propsAsIs: !1
}), Ms = () => ge, Te = /* @__PURE__ */ n(Ms())({
  name: "AlertContainer",
  class: "a1dybjw9",
  propsAsIs: !0
}), Us = /* @__PURE__ */ n("div")({
  name: "EarlyPrediction",
  class: "e1l05ict",
  propsAsIs: !1
}), Ks = () => w, _s = /* @__PURE__ */ n(Ks())({
  name: "EarlyPredictionIcon",
  class: "ez9juex",
  propsAsIs: !0
}), Hs = () => w, Gs = /* @__PURE__ */ n(Hs())({
  name: "SponsorIcon",
  class: "s8p4aob",
  propsAsIs: !0
}), Js = /* @__PURE__ */ n("button")({
  name: "ButtonContainer",
  class: "b1b6dl8t",
  propsAsIs: !1
}), Xs = /* @__PURE__ */ n("div")({
  name: "ButtonPctWrap",
  class: "b4iik8i",
  propsAsIs: !1
}), Zs = /* @__PURE__ */ n("div")({
  name: "ButtonPct",
  class: "b1gq1lnf",
  propsAsIs: !1
}), en = /* @__PURE__ */ n("span")({
  name: "ButtonBody",
  class: "b1j65z51",
  propsAsIs: !1
}), sn = /* @__PURE__ */ n("div")({
  name: "IconContainer",
  class: "i19tpfua",
  propsAsIs: !1
}), nn = /* @__PURE__ */ n("div")({
  name: "IconWrap",
  class: "i1tubmma",
  propsAsIs: !1
}), xe = /* @__PURE__ */ n("img")({
  name: "Icon",
  class: "i1grrgwj",
  propsAsIs: !1
}), tn = () => xe, rn = /* @__PURE__ */ n(tn())({
  name: "IconDefault",
  class: "ibemyq8",
  propsAsIs: !0
}), on = () => xe, an = /* @__PURE__ */ n(on())({
  name: "IconCircle",
  class: "i1dceht",
  propsAsIs: !0
}), cn = /* @__PURE__ */ n("span")({
  name: "Title",
  class: "t116q4vq",
  propsAsIs: !1
}), dn = /* @__PURE__ */ n("span")({
  name: "Indicators",
  class: "i17ajcu2",
  propsAsIs: !1
}), ln = /* @__PURE__ */ n("div")({
  name: "PtsWrap",
  class: "pu9kmlb",
  propsAsIs: !1
}), pn = /* @__PURE__ */ n("span")({
  name: "Pts",
  class: "p1j2j0s0",
  propsAsIs: !1
}), un = /* @__PURE__ */ n("span")({
  name: "Percentage",
  class: "p1mzj1sj",
  propsAsIs: !1
}), mn = () => w, hn = /* @__PURE__ */ n(mn())({
  name: "CheckIcon",
  class: "cichgz8",
  propsAsIs: !0
}), $e = {
  [J.CENTERED]: (s) => /* @__PURE__ */ e(rn, { "data-testid": "vote-icon", alt: "option-icon", src: s }),
  [J.TRANSPARENT]: (s) => /* @__PURE__ */ e(sn, { "data-testid": "vote-icon", children: /* @__PURE__ */ e(nn, { style: { backgroundImage: `url(${s})` } }) }),
  [J.ROUNDED]: (s) => /* @__PURE__ */ e(an, { "data-testid": "vote-icon", alt: "option-icon", src: s }),
  [J.NONE]: () => null,
  [J.UNSET]: () => null
}, In = ({ questionType: s, hasCorrectAnswer: t, correct: r, youVoted: l, questionVoted: o }) => {
  if (s === i.POLL && l)
    return "voted";
  if (s === i.PREDICTION) {
    if (!t && o)
      return l ? "voted" : "unset";
    if (t && o)
      return l ? r ? "correct" : "incorrect" : "unset";
    if (l)
      return "correct";
  }
  return s === i.TRIVIA && o && l ? r ? "correct" : "incorrect" : "unset";
}, vn = ({
  questionType: s,
  questionVoted: t,
  correct: r,
  hasCorrectAnswer: l,
  questionStatus: o
}) => s === i.TRIVIA ? t && r : s === i.PREDICTION ? t && r && l || o === se.RESOLVED && r : !1, An = _e(Js), yn = (s) => {
  var t;
  const {
    // option props
    id: r,
    icon: l,
    text: o,
    percentageDecimal: p,
    points: h,
    // extra props
    onVote: f,
    markThatVoted: P,
    firstOption: I,
    onPercentsAnimated: a,
    youSelected: R,
    youVoted: E,
    questionVoted: y,
    imageMode: m,
    answerTimeExpired: q,
    questionStatus: x,
    isLoading: g,
    questionType: T,
    correct: N,
    hasCorrectAnswer: k,
    marketClosed: S,
    isEarlyPrediction: D,
    isAd: O,
    webos: v
  } = s, [V, M] = b(0), G = In(s), ne = vn({ questionType: T, questionVoted: y, correct: N, hasCorrectAnswer: k, questionStatus: x }), L = S && T === i.PREDICTION, Q = y || L, re = T === i.PREDICTION && !y && !S && !O, F = y && !R && G !== "incorrect" && !E;
  return Ue(() => {
    M(0), requestAnimationFrame(() => {
      M(p);
    });
  }, [p]), /* @__PURE__ */ d(
    An,
    {
      value: r,
      webos: v,
      autoFocus: I,
      "data-selected": R,
      "data-answer-state": G,
      disabled: y || g || q || L,
      "data-is-not-checked": F,
      "data-a": "intr",
      onClick: (te) => {
        P(
          T === i.PREDICTION ? S : x === se.RESOLVED
        ), f(te);
      },
      "data-is-ad": O,
      children: [
        /* @__PURE__ */ e(Xs, { children: /* @__PURE__ */ e(
          Zs,
          {
            "data-answer-state": G,
            "data-is-not-checked": F,
            style: { width: `${Q ? V : 0}%` },
            onTransitionEnd: () => {
              L || a == null || a();
            },
            "data-is-ad": O
          }
        ) }),
        /* @__PURE__ */ d(en, { "data-a": "intr", children: [
          l && m && ((t = $e[m]) == null ? void 0 : t.call($e, l)),
          /* @__PURE__ */ e(cn, { "data-a": "intr", children: o }),
          re && /* @__PURE__ */ d(ln, { children: [
            h,
            /* @__PURE__ */ e(pn, { children: "pts" })
          ] }),
          Q && /* @__PURE__ */ d(dn, { children: [
            ne && /* @__PURE__ */ e(hn, { name: D ? "selectedBetPack" : "selected" }),
            /* @__PURE__ */ e(un, { children: /* @__PURE__ */ e(Ee, { value: p, suffix: "%" }) })
          ] })
        ] })
      ]
    }
  );
}, fn = () => Pe, Cn = /* @__PURE__ */ n(fn())({
  name: "ShowInContainer",
  class: "sie6cqo",
  propsAsIs: !0
}), Tn = /* @__PURE__ */ n("div")({
  name: "WinBarContainer",
  class: "wgizw4u",
  propsAsIs: !1
}), $n = /* @__PURE__ */ n("div")({
  name: "Content",
  class: "c1l3ucjp",
  propsAsIs: !1
}), En = /* @__PURE__ */ n("div")({
  name: "Title",
  class: "tx7j799",
  propsAsIs: !1
}), bn = () => w, wn = /* @__PURE__ */ n(bn())({
  name: "WinIcon",
  class: "w4lwuj0",
  propsAsIs: !0
}), gn = /* @__PURE__ */ n("div")({
  name: "Points",
  class: "po9i64o",
  propsAsIs: !1
}), Pn = /* @__PURE__ */ n("span")({
  name: "PointsCount",
  class: "pe5g05h",
  propsAsIs: !1
}), Rn = /* @__PURE__ */ n("span")({
  name: "PointsUnits",
  class: "p1hdtpmb",
  propsAsIs: !1
}), Dn = ({
  title: s,
  points: t,
  isPlayingTimer: r,
  isTimer: l,
  animatePoints: o,
  questionType: p,
  timerDuration: h,
  votedInCurrentRender: f,
  percentsAnimated: P,
  onTimerExpired: I
}) => /* @__PURE__ */ e(
  Cn,
  {
    enabled: p === i.PREDICTION && f,
    animate: P,
    children: /* @__PURE__ */ d(
      Tn,
      {
        style: {
          justifyContent: p === i.PREDICTION ? "center" : "space-between"
        },
        children: [
          /* @__PURE__ */ d($n, { children: [
            s && /* @__PURE__ */ e(En, { children: s }),
            t !== void 0 && p !== i.POLL && /* @__PURE__ */ d(z, { children: [
              /* @__PURE__ */ e(wn, { name: "icon-trophy" }),
              /* @__PURE__ */ d(gn, { children: [
                /* @__PURE__ */ e(Pn, { children: o ? /* @__PURE__ */ e(Ee, { value: t, delay: 0.3 }) : t }),
                /* @__PURE__ */ e(Rn, { children: "PTS" })
              ] })
            ] })
          ] }),
          l && p !== i.PREDICTION && /* @__PURE__ */ e(He, { isPlaying: r, onTimerExpired: I, duration: h })
        ]
      }
    )
  }
), qn = (s, t) => {
  switch (s) {
    case "already_voted":
      return t === i.POLL ? "You’ve already answered this question on another device." : "You’ve already answered this question on another device. So the points for this answer won't tally.";
    default:
      return "Something went wrong, please try again";
  }
}, Un = () => /* @__PURE__ */ e(Re, { children: /* @__PURE__ */ d(De, { children: [
  /* @__PURE__ */ e(le, { loading: !0, style: { height: "40px", borderRadius: "100px" } }),
  /* @__PURE__ */ e(le, { loading: !0, style: { height: "24px", margin: "16px 0" } }),
  /* @__PURE__ */ e(qe, { children: Array.from({ length: 5 }).map((s, t) => /* @__PURE__ */ e(le, { loading: !0, style: { height: "44px" } }, t)) })
] }) }), Kn = ({
  openedQuestion: s,
  isLoading: t,
  vote: r,
  close: l,
  isEarlyPrediction: o,
  mastersApp: p,
  webos: h
}) => {
  var f, P;
  const I = s.subject, a = s.type, R = s.status, E = (f = s.options) == null ? void 0 : f.options, y = s.marketClosed, m = s.id, q = ee(), x = ee(), g = p ? !1 : (s == null ? void 0 : s.adUnit) === Ke.STANDART, [T, N] = b(!1), [k, S] = b(!1), [D, O] = b(!0), [v, V] = b(!1), [M, G] = b(!1), [ne, L] = b(""), [Q, re] = b(""), [F, te] = b(!1), [ke, Oe] = b(!1), [me, Ne] = b(!1), { runAnimation: U, finished: he } = os();
  H(() => {
    he && l(m);
  }, [l, he]), H(() => {
    a === i.PREDICTION ? y && O(!1) : R === se.RESOLVED && O(!1);
  }, []);
  const Se = j((u) => {
    S(u), N(!0);
  }, []), Ve = j(() => {
    o && N(!1);
  }, [o]), oe = ee(!1), Ie = j(() => {
    x.current && clearTimeout(x.current), x.current = setTimeout(() => {
      Ne(!0), U({ delay: 5500 });
    }, 4e3);
  }, [U]), ve = j(
    async (u) => {
      if (!oe.current && (oe.current = !0, m)) {
        const $ = u.currentTarget.value;
        L($);
        try {
          await r(m, $), g && Ie();
        } catch (K) {
          re(qn(K.message, a)), L(""), console.error("Error while voting", K), oe.current = !1;
        }
      }
    },
    [a, m, L, r, g, Ie]
  ), je = j(() => {
    V(!0), U({ delay: 3500 });
  }, [U]), Le = j(() => {
    G(!0), U({ delay: 3500 });
  }, [U]), c = s == null ? void 0 : s.answers.find((u) => u.youVoted === !0), C = _(
    () => !!(s != null && s.answers.find((u) => u.correct === !0)),
    [s]
  ), A = _(
    () => s == null ? void 0 : s.answers.find((u) => u.correct === !0),
    [s]
  );
  H(() => {
    c && T && !ke && (q.current = setTimeout(Le, 1e4), Oe(!0));
  }, [c]), H(() => () => {
    clearTimeout(q.current), clearTimeout(x.current);
  }, []);
  const ae = _(() => s ? s.answers.map((u) => {
    var $;
    return {
      ...u,
      questionVoted: !!c,
      youSelected: ne === u.id,
      isLoading: t,
      hasCorrectAnswer: C,
      questionType: s.type,
      answerTimeExpired: v,
      questionStatus: R,
      imageMode: ($ = s.appearance) == null ? void 0 : $.images,
      onVote: ve
    };
  }) : [], [
    C,
    v,
    t,
    s,
    c,
    R,
    ve,
    ne
  ]);
  H(() => {
    const u = ae.some(({ percentageDecimal: K }) => K !== 0), $ = c && a === i.PREDICTION;
    Q && (o || !u || y && $) && te(!0);
  }, [ae, Q, o, y, a, c]);
  const Ae = E && (E.case === "trivia" || E.case === "prediction") ? E.value : void 0, W = R === se.RESOLVED && a === i.TRIVIA && !c && !D, ce = a === i.TRIVIA && k, de = _(() => g ? !1 : a === i.PREDICTION ? o ? !1 : !!(c && !C || c && C && A != null && A.youVoted) : !0, [a, c, C, A, o, g]), Qe = _(() => {
    if (a === i.PREDICTION && c && (!C || C && A != null && A.youVoted))
      return c.points;
    if (!(W || v))
      return c ? c.correct ? c.pointsEarned : 0 : A == null ? void 0 : A.points;
  }, [v, c, A, W, a, C]), Fe = _(() => a === i.PREDICTION && c ? C ? C && A != null && A.youVoted ? "You won" : "" : "To win" : W || v ? "Time expired" : a === i.POLL ? "Time remaining" : c ? "You won" : "To win", [v, a, c, W, C, A]), We = !de || de && a === i.PREDICTION && T && !F, Be = (a === i.TRIVIA || a === i.PREDICTION) && c && C && (A == null ? void 0 : A.youVoted), Ye = c || W || ce || a === i.TRIVIA && R === se.RESOLVED && D, ze = !o && (v || M) || me, Me = () => {
    const u = () => a === i.TRIVIA ? c != null && c.correct ? `That's correct!
You chose wisely.` : `So close!
Better luck next time.` : a === i.POLL ? `Thanks for answering.
Please stay tuned for the next question.` : a === i.PREDICTION ? "Stay tuned to see if your prediction was correct." : "", $ = () => a === i.TRIVIA ? `Your Pick: ${A == null ? void 0 : A.text}` : a === i.POLL || a === i.PREDICTION ? `Your Pick: ${c == null ? void 0 : c.text}` : "", K = () => a === i.TRIVIA && (E == null ? void 0 : E.case) === "trivia" ? E == null ? void 0 : E.value.explanation : a === i.PREDICTION ? I : "";
    return me ? /* @__PURE__ */ e(Te, { children: /* @__PURE__ */ e(
      js,
      {
        title: u(),
        description: $(),
        ...c != null && c.correct || a === i.POLL || a === i.PREDICTION ? { icon: "icon-correct" } : {},
        ...a === i.TRIVIA || a === i.PREDICTION ? { additionalDescription: K() } : {}
      }
    ) }) : !o && (v || M) ? /* @__PURE__ */ e(Te, { children: /* @__PURE__ */ e(
      As,
      {
        icon: "icon-check-circle",
        title: "More to come...",
        description: M ? /* @__PURE__ */ d(z, { children: [
          "Stay tuned for more questions ",
          /* @__PURE__ */ e("br", {}),
          " and insights."
        ] }) : /* @__PURE__ */ d(z, { children: [
          "Watch for additional enhanced stream ",
          /* @__PURE__ */ e("br", {}),
          " interactive experience."
        ] })
      }
    ) }) : null;
  };
  return /* @__PURE__ */ d(Qs, { children: [
    o && /* @__PURE__ */ e(Fs, {}),
    /* @__PURE__ */ e(Re, { style: o ? { marginTop: "-40px" } : {}, children: /* @__PURE__ */ d(De, { children: [
      !o && !g && /* @__PURE__ */ e(
        Ce,
        {
          feedbackMessages: Ae,
          questionVoted: !!c,
          questionVotedCorrectly: c == null ? void 0 : c.correct,
          questionType: a,
          hasCorrectAnswer: C,
          showExpiredNotification: W,
          showClosedNotificationTrivia: ce,
          votedInCurrentRender: T,
          votedAfterQuestionClosed: k,
          enteredAnActiveQuestion: D,
          marketClosed: y,
          percentsAnimated: F,
          voteErrorMessage: Q,
          votedAnswer: c
        }
      ),
      de && /* @__PURE__ */ e(
        Dn,
        {
          title: Fe,
          points: Qe,
          onTimerExpired: je,
          questionType: s.type,
          isTimer: !t,
          isPlayingTimer: !c,
          animatePoints: Be,
          timerDuration: Ye ? 0 : Number(((P = s == null ? void 0 : s.appearance) == null ? void 0 : P.autoHideInterval) || "30"),
          votedInCurrentRender: T,
          percentsAnimated: F
        }
      ),
      ze ? Me() : /* @__PURE__ */ d(z, { children: [
        o && /* @__PURE__ */ d(Us, { children: [
          /* @__PURE__ */ e(_s, { name: "iconEarlyPrediction" }),
          "EARLY PREDICTION"
        ] }),
        /* @__PURE__ */ e(Ys, { style: We ? { marginTop: 0 } : {}, children: I }),
        o && /* @__PURE__ */ e(
          Ce,
          {
            feedbackMessages: Ae,
            questionVoted: !!c,
            questionVotedCorrectly: c == null ? void 0 : c.correct,
            questionType: a,
            hasCorrectAnswer: C,
            showExpiredNotification: W,
            showClosedNotificationTrivia: ce,
            votedInCurrentRender: T,
            votedAfterQuestionClosed: k,
            enteredAnActiveQuestion: D,
            marketClosed: y,
            percentsAnimated: F,
            voteErrorMessage: Q,
            isEarlyPrediction: o,
            correctAnswer: A,
            votedAnswer: c,
            onAnimationEnd: Ve
          }
        ),
        /* @__PURE__ */ d(zs, { children: [
          /* @__PURE__ */ e(qe, { children: ae.sort((u, $) => u.id > $.id ? 1 : -1).map((u, $) => /* @__PURE__ */ e(
            yn,
            {
              ...u,
              firstOption: $ === 0,
              markThatVoted: Se,
              onPercentsAnimated: () => te(!0),
              votedAfterQuestionClosed: k,
              enteredAnActiveQuestion: D,
              marketClosed: y,
              isEarlyPrediction: o,
              isAd: g,
              webos: h
            },
            u.id
          )) }),
          o && /* @__PURE__ */ d(z, { children: [
            /* @__PURE__ */ e(Ws, {}),
            /* @__PURE__ */ e(Bs, { children: /* @__PURE__ */ e(Gs, { name: "mastersLogoWhite" }) })
          ] })
        ] })
      ] })
    ] }) })
  ] });
};
export {
  Bn as C,
  Yn as S,
  os as a,
  we as b,
  Ge as c,
  zn as d,
  Kn as e,
  ge as f,
  Wn as l,
  Fn as m,
  be as n,
  Qn as p,
  Un as t
};
