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

package/packages/event-game-play/src/components/Shared/Fixtures/Text/TextSelector.js

@@ -1,344 +0,0 @@
-import { j as e } from "../../../../../../../node_modules/react/jsx-runtime.js";
-import { useState as M } from "react";
-import { useTheme as L, Box as a, Select as E, Option as G, Input as Y, Typography as k } from "@mui/joy";
-import { useColors as _, useCornerRadius as q, useFontFamily as J, useSpacingScale as K, isMobile as N, useInternalTheme as Q, useBorderSize as U } 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 { useConstantContext as V } from "../../../../../../common/src/hooks/useConstantContext.js";
-import { ConstantsContext as X } from "../../../../../../common/src/providers/ConstantsProvider.js";
-import "../../../../../../common/src/providers/ContainerProvider.js";
-import { createStyles as Z } from "./TextSelector.styles.js";
-import { useTranslation as oo } from "../../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
-const xo = (r) => {
-  const { t: B } = oo(), f = _(), p = q(), d = J(), n = K(), g = N(), { shadowRootElement: w } = V(X), s = L(), F = Q(), j = U().size, [b, y] = M(r.prediction || ""), o = {
-    background: {
-      surface: s.colorSchemes.light.palette.background.surface,
-      popup: s.colorSchemes.light.palette.background.popup
-    },
-    neutral: {
-      outlinedBorder: s.colorSchemes.light.palette.neutral.outlinedBorder,
-      outlinedColor: s.colorSchemes.light.palette.neutral.outlinedColor,
-      outlinedHoverBg: s.colorSchemes.light.palette.neutral.outlinedHoverBg,
-      plainHoverBg: s.colorSchemes.light.palette.neutral.plainHoverBg,
-      plainHoverColor: s.colorSchemes.light.palette.neutral.plainHoverColor,
-      plainActiveBg: s.colorSchemes.light.palette.neutral.plainActiveBg
-    }
-  }, $ = {
-    fontFamily: d.secondary,
-    borderRadius: p.md,
-    bgcolor: o.background.surface,
-    borderColor: o.neutral.outlinedBorder,
-    color: o.neutral.outlinedColor,
-    fontSize: g ? "0.875em" : "1em",
-    lineHeight: "1.5",
-    "&:hover": {
-      bgcolor: o.neutral.outlinedHoverBg
-    },
-    "& input:-webkit-autofill": {
-      WebkitBoxShadow: `0 0 0 1000px ${o.background.surface} inset !important`,
-      WebkitTextFillColor: `${o.neutral.outlinedColor} !important`,
-      caretColor: o.neutral.outlinedColor,
-      borderRadius: p.md
-    },
-    "& input:-webkit-autofill:hover": {
-      WebkitBoxShadow: `0 0 0 1000px ${o.background.surface} inset !important`,
-      WebkitTextFillColor: `${o.neutral.outlinedColor} !important`
-    },
-    "& input:-webkit-autofill:focus": {
-      WebkitBoxShadow: `0 0 0 1000px ${o.background.surface} inset !important`,
-      WebkitTextFillColor: `${o.neutral.outlinedColor} !important`
-    },
-    "& input:-webkit-autofill:active": {
-      WebkitBoxShadow: `0 0 0 1000px ${o.background.surface} inset !important`,
-      WebkitTextFillColor: `${o.neutral.outlinedColor} !important`
-    },
-    "& input:-moz-autofill": {
-      backgroundColor: `${o.background.surface} !important`,
-      color: `${o.neutral.outlinedColor} !important`
-    },
-    "& input:autofill": {
-      backgroundColor: `${o.background.surface} !important`,
-      color: `${o.neutral.outlinedColor} !important`
-    }
-  }, H = {
-    root: {
-      sx: {
-        ...$,
-        "&:hover": { bgcolor: o.neutral.outlinedHoverBg }
-      }
-    },
-    listbox: {
-      container: w,
-      sx: {
-        maxHeight: g ? "200px" : "300px",
-        overflowY: "auto",
-        zIndex: 1300,
-        bgcolor: o.background.popup,
-        border: `1px solid ${o.neutral.outlinedBorder}`,
-        borderRadius: p.sm,
-        boxShadow: "0 4px 6px -1px rgb(0 0 0 / 0.1)"
-      }
-    }
-  }, T = {
-    fontFamily: d.secondary,
-    fontSize: g ? "0.875em" : "1em",
-    color: `${o.neutral.outlinedColor} !important`,
-    bgcolor: `${o.background.popup} !important`,
-    "&:hover": {
-      bgcolor: `${o.neutral.outlinedHoverBg} !important`,
-      color: `${o.neutral.outlinedColor} !important`
-    },
-    "&.Mui-selected": {
-      bgcolor: `${o.neutral.plainActiveBg} !important`,
-      color: `${o.neutral.outlinedColor} !important`
-    },
-    "&.Mui-selected:hover": {
-      bgcolor: `${o.neutral.outlinedHoverBg} !important`,
-      color: `${o.neutral.outlinedColor} !important`
-    }
-  }, C = Z({
-    spacingScale: n,
-    borderRadius: p,
-    fontFamilyPrimary: d.primary,
-    fontFamilySecondary: d.secondary,
-    textPrimary: o.neutral.outlinedColor,
-    textSecondary: o.neutral.outlinedColor,
-    neutralSoftBg: o.background.surface,
-    neutralOutlinedBorder: o.neutral.outlinedBorder,
-    neutralPlainHoverBg: o.neutral.outlinedHoverBg,
-    primary: f.palette.primary.plainColor,
-    onPrimary: f.palette.primary.onPrimary,
-    isMobile: g
-  }), O = (u) => {
-    const i = u.target.value;
-    y(i), r.onTextChange(i);
-  }, z = (u, i) => {
-    i !== null && (y(i), r.onTextChange(i));
-  }, c = r.validOutcomes ? typeof r.validOutcomes == "object" && "options" in r.validOutcomes ? r.validOutcomes.options : Array.isArray(r.validOutcomes) ? r.validOutcomes : null : null, W = c && c.length > 0, A = () => {
-    if (!c || !r.optionsLayout) return null;
-    const u = f.palette.primary.plainColor, i = f.palette.primary.onPrimary, P = F.colorSchemes.light.textColor, S = (t) => b === t ? {
-      bgcolor: u,
-      boxShadow: `inset 0 0 0 ${j} ${u}`,
-      color: i
-    } : {
-      bgcolor: "#FFFFFF",
-      color: P,
-      boxShadow: "none"
-    }, v = (t) => {
-      y(t), r.onTextChange(t);
-    };
-    if (r.optionsLayout === "twoByTwo") {
-      const t = [];
-      for (let l = 0; l < c.length; l += 2) {
-        const m = c.slice(l, l + 2);
-        t.push(m);
-      }
-      return /* @__PURE__ */ e.jsx(a, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: t.map((l, m) => /* @__PURE__ */ e.jsx(
-        a,
-        {
-          sx: {
-            display: "flex",
-            flexDirection: g ? "column" : "row",
-            gap: 2
-          },
-          children: l.map((x, h) => {
-            const { bgcolor: R, color: D, boxShadow: I } = S(x);
-            return /* @__PURE__ */ e.jsx(
-              a,
-              {
-                sx: {
-                  borderRadius: p.sm,
-                  flex: 1,
-                  p: n.xs,
-                  gap: n.xs,
-                  bgcolor: R,
-                  cursor: "pointer",
-                  transition: "all 300ms cubic-bezier(0.2, 0, 0, 1)",
-                  transform: "scale(1)",
-                  boxShadow: I,
-                  "&:hover": {
-                    transform: "scale(1.02)"
-                  },
-                  "&:active": {
-                    transform: "scale(0.98)"
-                  },
-                  display: "flex",
-                  flexDirection: "column"
-                },
-                onClick: () => v(x),
-                children: /* @__PURE__ */ e.jsx(
-                  k,
-                  {
-                    level: "body-md",
-                    sx: {
-                      fontFamily: d.primary,
-                      fontWeight: 500,
-                      fontSize: "0.935em",
-                      lineHeight: "16px",
-                      letterSpacing: "0.46px",
-                      textAlign: "center",
-                      color: D,
-                      px: n["2xs"],
-                      my: "auto"
-                    },
-                    children: x
-                  }
-                )
-              },
-              h
-            );
-          })
-        },
-        `row-${m}`
-      )) });
-    }
-    return r.optionsLayout === "column" ? /* @__PURE__ */ e.jsx(a, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: c.map((t, l) => {
-      const { bgcolor: m, color: x, boxShadow: h } = S(t);
-      return /* @__PURE__ */ e.jsx(
-        a,
-        {
-          sx: {
-            borderRadius: p.sm,
-            flex: 1,
-            p: n.xs,
-            gap: n.xs,
-            bgcolor: m,
-            cursor: "pointer",
-            transition: "all 300ms cubic-bezier(0.2, 0, 0, 1)",
-            transform: "scale(1)",
-            boxShadow: h,
-            "&:hover": {
-              transform: "scale(1.02)"
-            },
-            "&:active": {
-              transform: "scale(0.98)"
-            },
-            display: "flex",
-            flexDirection: "column"
-          },
-          onClick: () => v(t),
-          children: /* @__PURE__ */ e.jsx(
-            k,
-            {
-              level: "body-md",
-              sx: {
-                fontFamily: d.primary,
-                fontWeight: 500,
-                fontSize: "0.935em",
-                lineHeight: "16px",
-                letterSpacing: "0.46px",
-                textAlign: "center",
-                color: x,
-                px: n["2xs"],
-                my: "auto"
-              },
-              children: t
-            }
-          )
-        },
-        l
-      );
-    }) }) : /* @__PURE__ */ e.jsx(
-      a,
-      {
-        sx: {
-          display: "flex",
-          flexWrap: "wrap",
-          flexDirection: g ? "column" : "row",
-          gap: 2
-        },
-        children: c.map((t, l) => {
-          const { bgcolor: m, color: x, boxShadow: h } = S(t);
-          return /* @__PURE__ */ e.jsx(
-            a,
-            {
-              sx: {
-                borderRadius: p.sm,
-                flex: 1,
-                p: n.xs,
-                gap: n.xs,
-                bgcolor: m,
-                cursor: "pointer",
-                transition: "all 300ms cubic-bezier(0.2, 0, 0, 1)",
-                transform: "scale(1)",
-                boxShadow: h,
-                "&:hover": {
-                  transform: "scale(1.02)"
-                },
-                "&:active": {
-                  transform: "scale(0.98)"
-                },
-                display: "flex",
-                flexDirection: "column"
-              },
-              onClick: () => v(t),
-              children: /* @__PURE__ */ e.jsx(
-                k,
-                {
-                  level: "body-md",
-                  sx: {
-                    fontFamily: d.primary,
-                    fontWeight: 500,
-                    fontSize: "0.935em",
-                    lineHeight: "16px",
-                    letterSpacing: "0.46px",
-                    textAlign: "center",
-                    color: x,
-                    px: n["2xs"],
-                    my: "auto"
-                  },
-                  children: t
-                }
-              )
-            },
-            l
-          );
-        })
-      }
-    );
-  };
-  return /* @__PURE__ */ e.jsx(a, { sx: C.container, children: W ? /* @__PURE__ */ e.jsx(a, { sx: C.selectContainer, children: r.optionsLayout ? (
-    // If optionsLayout is provided, render button-based options
-    A()
-  ) : (
-    // Otherwise, render select dropdown (default behavior)
-    /* @__PURE__ */ e.jsx(
-      E,
-      {
-        value: b || null,
-        onChange: z,
-        placeholder: B("eventGame.fixtures.textSelectPlaceholder"),
-        slotProps: H,
-        children: c.map((u, i) => /* @__PURE__ */ e.jsx(G, { value: u, sx: T, children: u }, i))
-      }
-    )
-  ) }) : /* @__PURE__ */ e.jsx(a, { sx: C.inputContainer, children: /* @__PURE__ */ e.jsx(
-    Y,
-    {
-      value: b,
-      onChange: O,
-      placeholder: B("eventGame.fixtures.textInputPlaceholder"),
-      sx: {
-        ...$,
-        // Remove Joy UI's default focus outline
-        outline: "none",
-        "&:focus-within": {
-          bgcolor: o.background.surface,
-          // Add primary color border on focus
-          outline: `2px solid ${f.palette.primary.plainColor}`,
-          outlineOffset: "2px"
-        },
-        // Override Joy UI Input's internal focus styles
-        "&::before": {
-          display: "none"
-        },
-        "&:focus-within::before": {
-          display: "none"
-        }
-      }
-    }
-  ) }) });
-};
-export {
-  xo as default
-};

package/packages/event-game-play/src/components/Shared/Fixtures/Text/TextSelector.styles.js

@@ -1,70 +0,0 @@
-const e = (t) => ({
-  container: {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    width: "100%",
-    pt: t.isMobile ? t.spacingScale.md : t.spacingScale.lg
-  },
-  inputContainer: {
-    width: "100%",
-    maxWidth: t.isMobile ? "100%" : "500px"
-  },
-  textInput: {
-    fontFamily: t.fontFamilySecondary,
-    fontSize: t.isMobile ? "0.875em" : "1em",
-    lineHeight: "1.5",
-    color: `${t.textPrimary} !important`,
-    backgroundColor: `${t.neutralSoftBg} !important`,
-    borderColor: `${t.neutralOutlinedBorder} !important`,
-    borderRadius: t.borderRadius.md,
-    transition: "all 0.2s ease-in-out",
-    "&:hover": {
-      backgroundColor: `${t.neutralPlainHoverBg} !important`
-    },
-    "&::placeholder": {
-      color: t.textSecondary,
-      opacity: 0.6
-    }
-  },
-  selectContainer: {
-    width: "100%",
-    maxWidth: t.isMobile ? "100%" : "500px"
-  },
-  select: {
-    fontFamily: t.fontFamilySecondary,
-    fontSize: t.isMobile ? "0.875em" : "1em",
-    color: `${t.textPrimary} !important`,
-    backgroundColor: `${t.neutralSoftBg} !important`,
-    borderColor: `${t.neutralOutlinedBorder} !important`,
-    borderRadius: t.borderRadius.md,
-    "&:hover": {
-      backgroundColor: `${t.neutralPlainHoverBg} !important`
-    },
-    "& .MuiSelect-indicator": {
-      color: `${t.textPrimary} !important`
-    }
-  },
-  option: {
-    fontFamily: t.fontFamilySecondary,
-    fontSize: t.isMobile ? "0.875em" : "1em",
-    color: `${t.textPrimary} !important`,
-    bgcolor: "transparent",
-    "&:hover": {
-      bgcolor: `${t.neutralPlainHoverBg} !important`,
-      color: `${t.textPrimary} !important`
-    },
-    "&[aria-selected='true']": {
-      bgcolor: `${t.neutralPlainHoverBg} !important`,
-      color: `${t.textPrimary} !important`,
-      fontWeight: 600
-    },
-    "&[aria-selected='true']:hover": {
-      bgcolor: `${t.neutralPlainHoverBg} !important`,
-      color: `${t.textPrimary} !important`
-    }
-  }
-});
-export {
-  e as createStyles
-};

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

@@ -1,63 +0,0 @@
-const a = (e) => ({
-  base: {
-    width: e.isMobile ? "48px" : "64px",
-    height: e.isMobile ? "48px" : "64px",
-    backgroundColor: e.neutralSoftBg,
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    overflow: "hidden",
-    padding: e.isMobile ? e.spacingScale.xs : e.spacingScale.sm,
-    borderRadius: e.spacingScale.sm,
-    boxShadow: "0 5px 15px 0 rgba(49, 84, 139, .1)",
-    flexShrink: 0,
-    transition: "all 0.2s ease-in-out",
-    "&:hover": {
-      backgroundColor: e.neutralPlainHoverBg
-    }
-  },
-  selected: e.primary ? {
-    backgroundColor: e.primary,
-    "&:hover": {
-      backgroundColor: e.primary
-    },
-    borderRadius: e.spacingScale.sm
-  } : {
-    borderRadius: e.spacingScale.sm
-  },
-  text: {
-    fontFamily: "inherit",
-    fontSize: e.isMobile ? "0.625em" : "0.75em",
-    fontWeight: 600,
-    textAlign: "center"
-  },
-  selectedText: e.onPrimary ? {
-    color: e.onPrimary
-  } : {}
-}), n = (e) => ({
-  ...a(e),
-  selectedYes: e.successMain ? {
-    backgroundColor: e.successMain,
-    color: "white",
-    "&:hover": {
-      backgroundColor: e.successMain
-    },
-    borderRadius: e.spacingScale.sm
-  } : {
-    borderRadius: e.spacingScale.sm
-  },
-  selectedNo: e.dangerMain ? {
-    backgroundColor: e.dangerMain,
-    color: "white",
-    "&:hover": {
-      backgroundColor: e.dangerMain
-    },
-    borderRadius: e.spacingScale.sm
-  } : {
-    borderRadius: e.spacingScale.sm
-  }
-});
-export {
-  n as createOptionIconStyles,
-  a as createTeamLogoStyles
-};

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

@@ -1,220 +0,0 @@
-import { j as e } from "../../../../../../node_modules/react/jsx-runtime.js";
-import { Typography as n, Box as p, Sheet as B, Table as N, Avatar as P } from "@mui/joy";
-import w from "../../../../../../node_modules/@mui/icons-material/esm/Person.js";
-import { useInternalTheme as E, useColors as L, useFontFamily as A, useCornerRadius as M, useSpacingScale as k, isExtraSmall as R } from "../../../../../common/src/functions/theme.js";
-import { hexToRgb as d } 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 U from "../../../../../common/src/components/Spinner.js";
-import "react";
-import "../../../../../common/src/providers/ConstantsProvider.js";
-import "../../../../../common/src/providers/ContainerProvider.js";
-import { useTranslation as X } from "../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
-const oe = ({
-  leaderboard: m,
-  userRanking: i,
-  showHeading: F,
-  isSplitVariant: f,
-  loading: z = !1
-}) => {
-  const { t: a } = X(), W = E(), c = L(), b = c.palette.primary.plainColor, r = c.textColor, l = A().primary, I = A().secondary, G = M(), x = k(), g = R(), s = c.surfaceVariant, C = W.colorSchemes.light.palette.primary.onPrimary, y = c.outlineEnabledBorder, o = {
-    leaderboardContainer: {
-      display: "flex",
-      flexDirection: "column",
-      gap: x.md
-    },
-    leaderboardTitle: {
-      fontFamily: l,
-      fontWeight: 700,
-      fontSize: "1.25em",
-      color: r,
-      textAlign: "center",
-      marginBottom: x.sm
-    },
-    tableContainer: {
-      overflowX: "auto",
-      borderRadius: G.md,
-      border: `1px solid ${y}`
-    },
-    table: {
-      backgroundColor: s,
-      "--TableCell-paddingX": "0.5rem",
-      "--TableCell-paddingY": "0.375rem",
-      cursor: "default",
-      "& > tbody > tr:hover": {
-        backgroundColor: "transparent"
-      },
-      "& > thead > tr > th": {
-        backgroundColor: `rgba(${d(s)}, 0.8)`,
-        color: r,
-        fontFamily: l,
-        fontWeight: 600,
-        fontSize: "0.875em",
-        textAlign: "center",
-        borderBottom: `1px solid ${y}`
-      }
-    },
-    headerCellPosition: {
-      backgroundColor: `rgba(${d(s)}, 0.8)`,
-      color: r,
-      fontFamily: l,
-      fontWeight: 600,
-      fontSize: "0.875em",
-      textAlign: "center",
-      padding: "0.375rem 0.5rem",
-      width: "10%"
-    },
-    headerCellName: {
-      backgroundColor: `rgba(${d(s)}, 0.8)`,
-      color: r,
-      fontFamily: l,
-      fontWeight: 600,
-      fontSize: "0.875em",
-      textAlign: "left",
-      padding: "0.375rem 0.5rem",
-      width: "80%"
-    },
-    headerCellPoints: {
-      backgroundColor: `rgba(${d(s)}, 0.8)`,
-      color: r,
-      fontFamily: l,
-      fontWeight: 600,
-      fontSize: "0.875em",
-      textAlign: "center",
-      padding: "0.375rem 0.5rem",
-      width: "10%"
-    },
-    tableCellPosition: {
-      padding: "0.375rem 0.5rem",
-      width: "10%",
-      textAlign: "center"
-    },
-    tableCellName: {
-      padding: "0.375rem 0.5rem",
-      width: "80%"
-    },
-    tableCellPoints: {
-      padding: "0.375rem 0.5rem",
-      width: "10%",
-      textAlign: "center"
-    },
-    userRow: {
-      backgroundColor: `rgba(${d(b)}, 0.1)`
-    },
-    nameCell: {
-      display: "flex",
-      alignItems: "center",
-      gap: x.sm
-    },
-    leaderboardAvatar: {
-      width: "32px",
-      height: "32px",
-      fontSize: "0.875em",
-      fontWeight: 600,
-      backgroundColor: b,
-      color: C
-    },
-    nameText: {
-      fontFamily: l,
-      fontWeight: 500,
-      fontSize: "0.875em",
-      color: r,
-      overflow: "hidden",
-      textOverflow: "ellipsis",
-      whiteSpace: "nowrap"
-    },
-    positionText: {
-      fontFamily: l,
-      fontWeight: 600,
-      fontSize: "0.875em",
-      color: r
-    },
-    pointsText: {
-      fontFamily: l,
-      fontWeight: 600,
-      fontSize: "0.875em",
-      color: r
-    },
-    avatarIcon: {
-      fontSize: "1em",
-      color: C
-    },
-    noLeaderboardText: {
-      fontFamily: I,
-      fontSize: "1.25em",
-      color: r,
-      textAlign: "center",
-      marginY: x.md
-    }
-  };
-  if (z || !m)
-    return /* @__PURE__ */ e.jsx(U, { my: 10 });
-  if (m.length === 0)
-    return /* @__PURE__ */ e.jsx(n, { level: "body-lg", sx: o.noLeaderboardText, children: a("eventGame.leaderboard.noLeaderboardAvailable") });
-  const h = i == null ? void 0 : i.position, $ = h && m.some((t) => t.position === h);
-  return /* @__PURE__ */ e.jsxs(p, { sx: o.leaderboardContainer, children: [
-    F && /* @__PURE__ */ e.jsx(n, { level: "h4", sx: o.leaderboardTitle, children: a("eventGame.leaderboard.title") }),
-    /* @__PURE__ */ e.jsx(B, { sx: o.tableContainer, children: /* @__PURE__ */ e.jsxs(
-      N,
-      {
-        variant: "outlined",
-        hoverRow: !1,
-        borderAxis: "bothBetween",
-        size: "sm",
-        sx: o.table,
-        children: [
-          /* @__PURE__ */ e.jsx("thead", { children: /* @__PURE__ */ e.jsxs("tr", { children: [
-            /* @__PURE__ */ e.jsx("th", { style: o.headerCellPosition, children: g || f ? "" : a("eventGame.leaderboard.position") }),
-            /* @__PURE__ */ e.jsx("th", { style: o.headerCellName, children: a("eventGame.leaderboard.name") }),
-            /* @__PURE__ */ e.jsx("th", { style: o.headerCellPoints, children: g || f ? "🎯" : a("eventGame.leaderboard.points") })
-          ] }) }),
-          /* @__PURE__ */ e.jsxs("tbody", { children: [
-            i && !$ && /* @__PURE__ */ e.jsxs("tr", { style: o.userRow, children: [
-              /* @__PURE__ */ e.jsx("td", { style: o.tableCellPosition, children: /* @__PURE__ */ e.jsxs(n, { sx: o.positionText, children: [
-                "#",
-                i.position
-              ] }) }),
-              /* @__PURE__ */ e.jsx("td", { style: o.tableCellName, children: /* @__PURE__ */ e.jsxs(p, { sx: o.nameCell, children: [
-                /* @__PURE__ */ e.jsx(P, { sx: o.leaderboardAvatar, children: /* @__PURE__ */ e.jsx(w, { sx: o.avatarIcon }) }),
-                /* @__PURE__ */ e.jsx(n, { sx: o.nameText, children: a("eventGame.leaderboard.you") })
-              ] }) }),
-              /* @__PURE__ */ e.jsx("td", { style: o.tableCellPoints, children: /* @__PURE__ */ e.jsx(n, { sx: o.pointsText, children: i.totalPoints }) })
-            ] }),
-            m.map((t) => {
-              var u, v, S, T;
-              const j = h === t.position;
-              return /* @__PURE__ */ e.jsxs(
-                "tr",
-                {
-                  style: j ? o.userRow : void 0,
-                  children: [
-                    /* @__PURE__ */ e.jsx("td", { style: o.tableCellPosition, children: /* @__PURE__ */ e.jsxs(n, { sx: o.positionText, children: [
-                      "#",
-                      t.position
-                    ] }) }),
-                    /* @__PURE__ */ e.jsx("td", { style: o.tableCellName, children: /* @__PURE__ */ e.jsxs(p, { sx: o.nameCell, children: [
-                      /* @__PURE__ */ e.jsx(
-                        P,
-                        {
-                          src: ((u = t.profileModel) == null ? void 0 : u.avatar) || void 0,
-                          sx: o.leaderboardAvatar,
-                          children: (v = t.profileModel) != null && v.avatar ? /* @__PURE__ */ e.jsx(e.Fragment, {}) : /* @__PURE__ */ e.jsx(w, { sx: o.avatarIcon })
-                        }
-                      ),
-                      /* @__PURE__ */ e.jsx(n, { sx: o.nameText, children: j ? a("eventGame.leaderboard.you") : ((S = t.profileModel) == null ? void 0 : S.nickname) || ((T = t.profileModel) == null ? void 0 : T.name) })
-                    ] }) }),
-                    /* @__PURE__ */ e.jsx("td", { style: o.tableCellPoints, children: /* @__PURE__ */ e.jsx(n, { sx: o.pointsText, children: t.totalPoints }) })
-                  ]
-                },
-                t.profileId
-              );
-            })
-          ] })
-        ]
-      }
-    ) })
-  ] });
-};
-export {
-  oe as default
-};