fansunited-frontend-components 0.0.31-RC5 → 0.0.31-RC6

package/packages/event-game-play/src/components/Shared/FinishedGameWrapper/FinishedGameWrapper.js

@@ -1,574 +0,0 @@
-import { j as e } from "../../../../../../node_modules/react/jsx-runtime.js";
-import _ from "react";
-import { Box as t, Tabs as L, TabList as Y, Tab as E, tabClasses as P, Typography as i, TabPanel as G } from "@mui/joy";
-import { useInternalTheme as q, isMobile as J, isExtraSmall as K, useCornerRadius as Q, useColors as d, useFontFamily as R, useSpacingScale as X } 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 "../../../../../common/src/providers/ConstantsProvider.js";
-import "../../../../../common/src/providers/ContainerProvider.js";
-import Z from "../../../assets/school.svg.js";
-import O from "../../../assets/sports_score.svg.js";
-import { EventGameOutcomeTypeEnum as m } from "fansunited-sdk-esm";
-import { useTranslation as V } from "../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
-const me = ({
-  prediction: p,
-  game: B,
-  resultsTabPanelSxProps: T,
-  isOverlayVariant: r,
-  children: v,
-  brandingColors: f
-}) => {
-  const [H, W] = _.useState(0), l = q(), { t: x } = V(), b = J(), y = K(), S = Q().md, h = r ? l.colorSchemes.dark.textPrimary : d().textPrimary, F = r ? l.colorSchemes.dark.textSecondary : d().textSecondary, u = R().primary, j = R().secondary, z = r ? l.colorSchemes.dark.secondaryContainer : d().secondaryContainer, w = f != null && f.backgroundColor || r ? l.colorSchemes.dark.surfaceVariant : d().surfaceVariant, c = X(), N = r ? l.colorSchemes.dark.palette.success.plainColor : d().palette.success.plainColor, D = r ? l.colorSchemes.dark.palette.danger.plainColor : d().palette.danger.plainColor, C = r ? l.colorSchemes.dark.outlineEnabledBorder : d().outlineEnabledBorder, k = r ? l.colorSchemes.dark.palette.neutral.softBg : d().palette.neutral.softBg;
-  let I = r ? l.colorSchemes.dark.textPrimary : d().textPrimary;
-  f != null && f.primaryColor && (I = f.primaryColor);
-  const $ = (s, o) => {
-    const n = {
-      display: "flex",
-      alignItems: "center",
-      gap: c.xs,
-      fontSize: "0.875em",
-      padding: "2px 6px",
-      minHeight: "20px",
-      borderRadius: S,
-      border: `1px solid ${C}`,
-      backgroundColor: k,
-      width: "fit-content"
-    }, a = {
-      fontFamily: u,
-      fontWeight: 500,
-      fontSize: "0.875em",
-      color: h
-    };
-    if (o === m.BOOLEAN) {
-      const g = s === !0;
-      return /* @__PURE__ */ e.jsx(t, { sx: n, children: /* @__PURE__ */ e.jsx(i, { sx: a, children: x(g ? "eventGame.fixtures.yes" : "eventGame.fixtures.no") }) });
-    }
-    return o === m.NUMBER ? /* @__PURE__ */ e.jsx(t, { sx: n, children: /* @__PURE__ */ e.jsx(i, { sx: a, children: s }) }) : o === m.ENUM || o === m.FREE_INPUT ? /* @__PURE__ */ e.jsx(t, { sx: n, children: /* @__PURE__ */ e.jsx(i, { sx: a, children: s }) }) : null;
-  }, M = (s, o) => {
-    const n = {
-      display: "flex",
-      alignItems: "center",
-      gap: c.xs,
-      fontSize: "0.75em",
-      padding: "2px 6px",
-      minHeight: "20px",
-      borderRadius: S,
-      border: `1px solid ${C}`,
-      backgroundColor: k,
-      width: "fit-content"
-    }, a = {
-      fontFamily: u,
-      fontWeight: 500,
-      fontSize: y ? "0.75em" : "0.875em",
-      color: h
-    };
-    if (o === m.BOOLEAN) {
-      const g = s === !0;
-      return /* @__PURE__ */ e.jsx(t, { sx: n, children: /* @__PURE__ */ e.jsx(i, { sx: a, children: x(g ? "eventGame.fixtures.yes" : "eventGame.fixtures.no") }) });
-    }
-    return o === m.NUMBER ? /* @__PURE__ */ e.jsx(t, { sx: n, children: /* @__PURE__ */ e.jsx(i, { sx: a, children: s }) }) : o === m.ENUM || o === m.FREE_INPUT ? /* @__PURE__ */ e.jsx(t, { sx: n, children: /* @__PURE__ */ e.jsx(i, { sx: a, children: s }) }) : null;
-  }, U = (s) => {
-    var g;
-    const o = B.fixtures.find((A) => A.id === s), n = (g = p == null ? void 0 : p.fixtures) == null ? void 0 : g.find(
-      (A) => A.id === s
-    );
-    if (!o || !n) return null;
-    const a = n.correct === !0;
-    return /* @__PURE__ */ e.jsx(
-      t,
-      {
-        sx: {
-          borderRadius: S,
-          p: c.md,
-          display: "flex",
-          flexDirection: "column",
-          alignItems: "center",
-          alignSelf: "stretch",
-          gap: c.md,
-          backdropFilter: "blur(4px)",
-          position: "relative",
-          "&::before": {
-            content: '""',
-            position: "absolute",
-            top: 0,
-            left: 0,
-            right: 0,
-            bottom: 0,
-            backgroundColor: w,
-            opacity: 0.5,
-            borderRadius: "inherit",
-            zIndex: 0,
-            backdropFilter: "blur(4px)"
-          },
-          "& > *": {
-            position: "relative",
-            zIndex: 1
-          }
-        },
-        children: /* @__PURE__ */ e.jsxs(
-          t,
-          {
-            sx: {
-              display: "flex",
-              flexDirection: "column",
-              alignItems: "flex-start",
-              gap: "12px",
-              alignSelf: "stretch"
-            },
-            children: [
-              /* @__PURE__ */ e.jsxs(
-                t,
-                {
-                  sx: {
-                    display: "flex",
-                    justifyContent: "space-between",
-                    alignItems: "center",
-                    alignSelf: "stretch"
-                  },
-                  children: [
-                    /* @__PURE__ */ e.jsx(
-                      i,
-                      {
-                        sx: {
-                          color: h,
-                          fontFamily: u,
-                          fontSize: "1.25em",
-                          fontStyle: "normal",
-                          fontWeight: 500,
-                          lineHeight: "120%",
-                          letterSpacing: "0.15px",
-                          flex: 1
-                        },
-                        children: o.question
-                      }
-                    ),
-                    !y && n.points !== void 0 && n.points !== null && /* @__PURE__ */ e.jsx(
-                      t,
-                      {
-                        sx: {
-                          display: "flex",
-                          alignItems: "center",
-                          gap: c.xs,
-                          padding: `${c.xs} ${c.sm}`,
-                          borderRadius: S,
-                          backgroundColor: k
-                        },
-                        children: /* @__PURE__ */ e.jsxs(
-                          i,
-                          {
-                            sx: {
-                              color: h,
-                              fontFamily: j,
-                              fontSize: "0.875em",
-                              fontWeight: 600
-                            },
-                            children: [
-                              n.points,
-                              " ",
-                              x("eventGame.points.pts")
-                            ]
-                          }
-                        )
-                      }
-                    )
-                  ]
-                }
-              ),
-              /* @__PURE__ */ e.jsxs(
-                t,
-                {
-                  sx: {
-                    alignSelf: "stretch",
-                    display: "flex",
-                    flexDirection: "column",
-                    gap: c.xs
-                  },
-                  children: [
-                    /* @__PURE__ */ e.jsxs(
-                      t,
-                      {
-                        sx: {
-                          display: "flex",
-                          alignItems: "center",
-                          gap: c.xs
-                        },
-                        children: [
-                          /* @__PURE__ */ e.jsx(
-                            i,
-                            {
-                              sx: {
-                                color: a ? r ? l.colorSchemes.dark.palette.success.plainColor : N : r ? l.colorSchemes.dark.palette.danger.plainColor : D,
-                                fontFamily: j,
-                                fontSize: "1em",
-                                fontStyle: "normal",
-                                fontWeight: a ? 700 : 600,
-                                lineHeight: "20px",
-                                letterSpacing: "0.15px"
-                              },
-                              children: x("eventGame.yourPrediction")
-                            }
-                          ),
-                          $(
-                            n.prediction,
-                            o.outcomeType
-                          )
-                        ]
-                      }
-                    ),
-                    !a && o.outcome !== null && o.outcome !== void 0 && /* @__PURE__ */ e.jsxs(
-                      t,
-                      {
-                        sx: {
-                          display: "flex",
-                          alignItems: "center",
-                          gap: c.xs
-                        },
-                        children: [
-                          /* @__PURE__ */ e.jsx(
-                            i,
-                            {
-                              sx: {
-                                color: h,
-                                fontFamily: j,
-                                fontSize: "1em",
-                                fontStyle: "normal",
-                                fontWeight: 600,
-                                lineHeight: "20px",
-                                letterSpacing: "0.15px"
-                              },
-                              children: x("eventGame.correctPrediction")
-                            }
-                          ),
-                          M(
-                            o.outcome,
-                            o.outcomeType
-                          )
-                        ]
-                      }
-                    )
-                  ]
-                }
-              ),
-              y && n.points !== void 0 && n.points !== null && n.points > 0 && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-                /* @__PURE__ */ e.jsx(
-                  t,
-                  {
-                    sx: {
-                      width: "100%",
-                      height: "1px",
-                      backgroundColor: C
-                    }
-                  }
-                ),
-                /* @__PURE__ */ e.jsx(
-                  t,
-                  {
-                    sx: {
-                      display: "flex",
-                      justifyContent: "flex-start",
-                      alignItems: "center",
-                      alignSelf: "stretch"
-                    },
-                    children: /* @__PURE__ */ e.jsxs(
-                      i,
-                      {
-                        sx: {
-                          color: h,
-                          fontFamily: j,
-                          fontSize: "1em",
-                          fontStyle: "normal",
-                          fontWeight: 600,
-                          lineHeight: "20px",
-                          letterSpacing: "0.15px"
-                        },
-                        children: [
-                          x("eventGame.earnedPoints"),
-                          ": ",
-                          n.points
-                        ]
-                      }
-                    )
-                  }
-                )
-              ] })
-            ]
-          },
-          `single-prediction-${s}`
-        )
-      },
-      `user-prediction-${s}`
-    );
-  };
-  return /* @__PURE__ */ e.jsx(t, { sx: { width: "100%" }, children: /* @__PURE__ */ e.jsxs(
-    L,
-    {
-      value: H,
-      onChange: (s, o) => W(o),
-      sx: {
-        borderRadius: S,
-        width: "100%",
-        // Ensure tabs container takes full width
-        backgroundColor: "transparent"
-      },
-      children: [
-        /* @__PURE__ */ e.jsxs(
-          Y,
-          {
-            sx: {
-              fontSize: b ? "0.75em" : "1em",
-              "--Icon-fontSize": b ? "1em" : "1.25em"
-            },
-            children: [
-              /* @__PURE__ */ e.jsx(
-                E,
-                {
-                  sx: {
-                    display: "flex",
-                    flexDirection: "column",
-                    justifyContent: "center",
-                    alignItems: "center",
-                    flex: 1,
-                    // Make each tab take equal width
-                    borderBottom: "1px solid " + z,
-                    opacity: "60%",
-                    "&:not(.Mui-selected):hover": {
-                      bgcolor: r ? "#FAFAFA14" : "#2121210A"
-                      // Highlight selected tab
-                    },
-                    [`&.${P.selected}`]: {
-                      bgcolor: r ? "#FAFAFA14" : "#2121210A",
-                      // Highlight selected tab
-                      borderBottom: "3px solid " + I,
-                      opacity: "100%",
-                      mb: "-1px"
-                    }
-                  },
-                  disableIndicator: !0,
-                  children: /* @__PURE__ */ e.jsxs(
-                    t,
-                    {
-                      sx: {
-                        display: "flex",
-                        py: "12px",
-                        px: "16px",
-                        justifyContent: "center",
-                        alignItems: "center",
-                        gap: "8px",
-                        width: "100%"
-                        // Ensure inner box also takes full width
-                      },
-                      children: [
-                        /* @__PURE__ */ e.jsx(
-                          "img",
-                          {
-                            src: O,
-                            alt: "results-icon",
-                            style: {
-                              display: "flex",
-                              width: "24px",
-                              height: "24px",
-                              justifyContent: "center",
-                              alignItems: "center",
-                              filter: r || l.mode == "dark" ? "brightness(0) invert(1)" : "none"
-                            }
-                          }
-                        ),
-                        /* @__PURE__ */ e.jsx(
-                          i,
-                          {
-                            sx: {
-                              color: F,
-                              fontFamily: u,
-                              fontSize: "1em",
-                              fontStyle: "normal",
-                              fontWeight: 500,
-                              lineHeight: "24px",
-                              letterSpacing: "0.4px",
-                              textTransform: "uppercase"
-                            },
-                            children: x("eventGame.leaderboard.title")
-                          }
-                        )
-                      ]
-                    }
-                  )
-                }
-              ),
-              /* @__PURE__ */ e.jsx(
-                E,
-                {
-                  sx: {
-                    display: "flex",
-                    flexDirection: "column",
-                    justifyContent: "center",
-                    alignItems: "center",
-                    flex: 1,
-                    // Make each tab take equal width
-                    borderBottom: "1px solid " + z,
-                    opacity: "60%",
-                    "&:not(.Mui-selected):hover": {
-                      bgcolor: r ? "#FAFAFA14" : "#2121210A"
-                      // Highlight selected tab
-                    },
-                    [`&.${P.selected}`]: {
-                      bgcolor: r ? "#FAFAFA14" : "#2121210A",
-                      // Highlight selected tab
-                      borderBottom: "3px solid " + I,
-                      opacity: "100%",
-                      mb: "-1px"
-                    }
-                  },
-                  disableIndicator: !0,
-                  children: /* @__PURE__ */ e.jsxs(
-                    t,
-                    {
-                      sx: {
-                        display: "flex",
-                        py: "12px",
-                        px: "16px",
-                        justifyContent: "center",
-                        alignItems: "center",
-                        gap: "8px",
-                        width: "100%"
-                        // Ensure inner box also takes full width
-                      },
-                      children: [
-                        /* @__PURE__ */ e.jsx(
-                          "img",
-                          {
-                            src: Z,
-                            alt: "predictions-icon",
-                            style: {
-                              display: "flex",
-                              width: "24px",
-                              height: "24px",
-                              justifyContent: "center",
-                              alignItems: "center",
-                              filter: r || l.mode == "dark" ? "brightness(0) invert(1)" : "none"
-                            }
-                          }
-                        ),
-                        /* @__PURE__ */ e.jsx(
-                          i,
-                          {
-                            sx: {
-                              color: F,
-                              fontFamily: u,
-                              fontSize: "1em",
-                              fontStyle: "normal",
-                              fontWeight: 500,
-                              lineHeight: "24px",
-                              letterSpacing: "0.4px",
-                              textTransform: "uppercase"
-                            },
-                            children: x("eventGame.predictions")
-                          }
-                        )
-                      ]
-                    }
-                  )
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ e.jsx(
-          G,
-          {
-            value: 0,
-            sx: {
-              ...T,
-              fontSize: y ? "0.625em" : b ? "0.75em" : "1em"
-            },
-            children: v
-          }
-        ),
-        /* @__PURE__ */ e.jsx(
-          G,
-          {
-            value: 1,
-            sx: {
-              overflowY: "auto",
-              maxHeight: b ? "auto" : "450px",
-              fontSize: y ? "0.75em" : "1em"
-            },
-            children: /* @__PURE__ */ e.jsx(
-              t,
-              {
-                sx: {
-                  display: "flex",
-                  flexDirection: "column",
-                  justifyContent: "center",
-                  alignItems: "center",
-                  gap: "16px",
-                  alignSelf: "stretch"
-                },
-                children: p != null && p.fixtures && p.fixtures.length > 0 ? B.fixtures.map((s) => U(s.id)) : (
-                  // Empty state when user has no predictions
-                  /* @__PURE__ */ e.jsx(
-                    t,
-                    {
-                      sx: {
-                        display: "flex",
-                        flexDirection: "column",
-                        justifyContent: "center",
-                        alignItems: "center",
-                        gap: c.lg,
-                        alignSelf: "stretch",
-                        minHeight: "200px",
-                        textAlign: "center",
-                        py: c.xl
-                      },
-                      children: /* @__PURE__ */ e.jsxs(
-                        t,
-                        {
-                          sx: {
-                            display: "flex",
-                            flexDirection: "column",
-                            gap: c.xs,
-                            alignItems: "center"
-                          },
-                          children: [
-                            /* @__PURE__ */ e.jsx(
-                              i,
-                              {
-                                sx: {
-                                  color: h,
-                                  fontFamily: u,
-                                  fontSize: "1.25em",
-                                  fontWeight: 600,
-                                  lineHeight: "1.2"
-                                },
-                                children: x("eventGame.noPredictions.title")
-                              }
-                            ),
-                            /* @__PURE__ */ e.jsx(
-                              i,
-                              {
-                                sx: {
-                                  color: F,
-                                  fontFamily: j,
-                                  fontSize: "1em",
-                                  fontWeight: 400,
-                                  lineHeight: "1.4"
-                                },
-                                children: x("eventGame.noPredictions.description")
-                              }
-                            )
-                          ]
-                        }
-                      )
-                    }
-                  )
-                )
-              }
-            )
-          }
-        )
-      ]
-    }
-  ) });
-};
-export {
-  me as default
-};

package/packages/event-game-play/src/components/Shared/Fixtures/Boolean/BooleanFixture.js

@@ -1,60 +0,0 @@
-import { j as e } from "../../../../../../../node_modules/react/jsx-runtime.js";
-import { Box as o, Typography as c } from "@mui/joy";
-import { useColors as y, isExtraSmall as d, useCornerRadius as f, useFontFamily as u, useSpacingScale as S } 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 { useConstantContext as p } from "../../../../../../common/src/hooks/useConstantContext.js";
-import "../../../../../../common/src/providers/ConstantsProvider.js";
-import "../../../../../../common/src/providers/ContainerProvider.js";
-import j from "./BooleanSelector.js";
-import { createStyles as C } from "./BooleanFixture.styles.js";
-import g from "../PointsDisplay/PointsDisplay.js";
-import { EventGameConstantsContext as h } from "../../../../providers/ConstantsProvider.js";
-const G = (t) => {
-  const r = y(), l = d(), m = f(), i = u(), n = S(), { points: x } = p(h), a = t.useExtraSmallLayout !== void 0 ? t.useExtraSmallLayout : l, s = C({
-    spacingScale: n,
-    borderRadius: m,
-    fontFamilyPrimary: i.primary,
-    fontFamilySecondary: i.secondary,
-    textPrimary: r.textPrimary,
-    textSecondary: r.textSecondary,
-    isExtraSmall: a
-  });
-  return /* @__PURE__ */ e.jsxs(o, { sx: s.container, children: [
-    /* @__PURE__ */ e.jsxs(
-      o,
-      {
-        sx: {
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "space-between",
-          width: "100%",
-          gap: n.sm
-        },
-        children: [
-          a ? /* @__PURE__ */ e.jsx(e.Fragment, {}) : /* @__PURE__ */ e.jsx(o, { sx: { flex: 1 } }),
-          /* @__PURE__ */ e.jsx(c, { level: "h3", sx: s.title, children: t.question }),
-          /* @__PURE__ */ e.jsx(o, { sx: { flex: 1, display: "flex", justifyContent: "flex-end" }, children: t.showPoints !== !1 && x.length > 0 && /* @__PURE__ */ e.jsx(
-            g,
-            {
-              fixtureId: t.fixtureId,
-              brandingPrimaryColor: t.brandingPrimaryColor,
-              isSplitVariant: t.isSplitVariant
-            }
-          ) })
-        ]
-      }
-    ),
-    /* @__PURE__ */ e.jsx(
-      j,
-      {
-        onSelectionChange: t.onSelectionChange,
-        prediction: t.prediction
-      }
-    )
-  ] });
-};
-export {
-  G as default
-};

package/packages/event-game-play/src/components/Shared/Fixtures/Boolean/BooleanFixture.styles.js

@@ -1,29 +0,0 @@
-import { isMobile as e } 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 "../../../../../../../node_modules/react/jsx-runtime.js";
-import "@mui/joy";
-import "react";
-import "../../../../../../common/src/providers/ConstantsProvider.js";
-import "../../../../../../common/src/providers/ContainerProvider.js";
-const p = (t) => {
-  const i = e();
-  return {
-    container: {
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "center"
-    },
-    title: {
-      fontFamily: t.fontFamilyPrimary,
-      fontWeight: 600,
-      fontSize: i ? "1.125em" : "1.25em",
-      lineHeight: 1.2,
-      color: t.textPrimary,
-      textAlign: t.isExtraSmall ? "left" : "center"
-    }
-  };
-};
-export {
-  p as createStyles
-};