fansunited-frontend-components 0.0.31-RC4 → 0.0.31-RC5

package/packages/match-quiz-play/src/components/Shared/FinishedGameWrapper/EarnedPointsDisplay.js

@@ -0,0 +1,64 @@
+import { j as o } from "../../../../../../node_modules/react/jsx-runtime.js";
+import { Box as F, Typography as n } from "@mui/joy";
+import { useColors as P, useCornerRadius as B, useFontFamily as R, useSpacingScale as W } 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 k } from "../../../../../common/src/hooks/useConstantContext.js";
+import "../../../../../common/src/providers/ConstantsProvider.js";
+import "../../../../../common/src/providers/ContainerProvider.js";
+import { MatchQuizConstantsContext as E } from "../../../providers/ConstantsProvider.js";
+import { useTranslation as T } from "../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
+const J = ({
+  market: p,
+  earnedPoints: m
+}) => {
+  const { t: d } = T(), t = P(), f = B(), e = R(), r = W(), { points: x } = k(E), i = x.find((z) => z.id === p);
+  if (!i)
+    return null;
+  const u = i.points, s = m ?? 0, a = s > 0, y = t.palette.success.plainColor, g = t.palette.danger.plainColor, S = t.textSecondary, l = a ? y : s === 0 ? g : S, h = a ? t.palette.success.softBg : s === 0 ? t.palette.danger.softBg : t.palette.neutral.softBg, C = {
+    display: "flex",
+    alignItems: "center",
+    gap: r.xs,
+    padding: `${r.xs} ${r.xs}`,
+    borderRadius: f.md,
+    backgroundColor: h,
+    border: `1px solid ${l}`,
+    minWidth: "fit-content",
+    flexShrink: 0
+  }, j = {
+    fontFamily: e.primary,
+    fontWeight: 700,
+    fontSize: "0.875em",
+    lineHeight: 1,
+    color: l
+  }, b = {
+    fontFamily: e.primary,
+    fontWeight: 500,
+    fontSize: "0.75em",
+    color: t.textSecondary
+  }, c = {
+    fontFamily: e.primary,
+    fontWeight: 500,
+    fontSize: "0.75em",
+    color: t.textSecondary
+  };
+  return /* @__PURE__ */ o.jsxs(F, { sx: C, children: [
+    /* @__PURE__ */ o.jsx(n, { sx: j, children: s }),
+    /* @__PURE__ */ o.jsx(n, { sx: b, children: "/" }),
+    /* @__PURE__ */ o.jsx(n, { sx: c, children: u }),
+    /* @__PURE__ */ o.jsx(
+      n,
+      {
+        sx: {
+          ...c,
+          fontSize: "0.625em"
+        },
+        children: d("matchQuiz.points.pts")
+      }
+    )
+  ] });
+};
+export {
+  J as default
+};