@sensiblestats/widget-react 0.52.0 → 0.53.0

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @sensiblestats/widget-react
 
+## 0.53.0
+
+### Minor Changes
+
+- Games data batch 2 (client surfaces):
+
+  - Beat the Grid: the cell search now uses the club player pool carried in ConfigJson (`playerPool`), threaded through `GameScreenHost` instead of an empty list — the search box was previously always empty.
+  - Mystery Tiger: each guess tile now shows the guessed player's own attribute value (e.g. "ST", a nationality flag, "22 ▲") instead of a bare glyph, falling back to the verdict glyph when no value is present.
+
 ## 0.52.0
 
 ### Minor Changes

package/dist/index.cjs

@@ -4229,6 +4229,89 @@ function useGamePlay(conversation, { gameId, gameDay, fixtureId, refresh }) {
 
 // src/components/games/MysteryTigerGame.tsx
 var import_react29 = require("react");
+
+// src/components/games/nationFlags.ts
+var FLAGS = {
+  england: "\u{1F3F4}\u{E0067}\u{E0062}\u{E0065}\u{E006E}\u{E0067}\u{E007F}",
+  scotland: "\u{1F3F4}\u{E0067}\u{E0062}\u{E0073}\u{E0063}\u{E0074}\u{E007F}",
+  wales: "\u{1F3F4}\u{E0067}\u{E0062}\u{E0077}\u{E006C}\u{E0073}\u{E007F}",
+  "northern ireland": "\u{1F1EC}\u{1F1E7}",
+  "republic of ireland": "\u{1F1EE}\u{1F1EA}",
+  ireland: "\u{1F1EE}\u{1F1EA}",
+  "united kingdom": "\u{1F1EC}\u{1F1E7}",
+  france: "\u{1F1EB}\u{1F1F7}",
+  spain: "\u{1F1EA}\u{1F1F8}",
+  portugal: "\u{1F1F5}\u{1F1F9}",
+  germany: "\u{1F1E9}\u{1F1EA}",
+  italy: "\u{1F1EE}\u{1F1F9}",
+  netherlands: "\u{1F1F3}\u{1F1F1}",
+  belgium: "\u{1F1E7}\u{1F1EA}",
+  switzerland: "\u{1F1E8}\u{1F1ED}",
+  austria: "\u{1F1E6}\u{1F1F9}",
+  denmark: "\u{1F1E9}\u{1F1F0}",
+  sweden: "\u{1F1F8}\u{1F1EA}",
+  norway: "\u{1F1F3}\u{1F1F4}",
+  finland: "\u{1F1EB}\u{1F1EE}",
+  iceland: "\u{1F1EE}\u{1F1F8}",
+  poland: "\u{1F1F5}\u{1F1F1}",
+  czechia: "\u{1F1E8}\u{1F1FF}",
+  "czech republic": "\u{1F1E8}\u{1F1FF}",
+  croatia: "\u{1F1ED}\u{1F1F7}",
+  serbia: "\u{1F1F7}\u{1F1F8}",
+  "bosnia and herzegovina": "\u{1F1E7}\u{1F1E6}",
+  greece: "\u{1F1EC}\u{1F1F7}",
+  romania: "\u{1F1F7}\u{1F1F4}",
+  ukraine: "\u{1F1FA}\u{1F1E6}",
+  russia: "\u{1F1F7}\u{1F1FA}",
+  hungary: "\u{1F1ED}\u{1F1FA}",
+  slovakia: "\u{1F1F8}\u{1F1F0}",
+  slovenia: "\u{1F1F8}\u{1F1EE}",
+  turkey: "\u{1F1F9}\u{1F1F7}",
+  t\u00FCrkiye: "\u{1F1F9}\u{1F1F7}",
+  albania: "\u{1F1E6}\u{1F1F1}",
+  "north macedonia": "\u{1F1F2}\u{1F1F0}",
+  brazil: "\u{1F1E7}\u{1F1F7}",
+  argentina: "\u{1F1E6}\u{1F1F7}",
+  uruguay: "\u{1F1FA}\u{1F1FE}",
+  colombia: "\u{1F1E8}\u{1F1F4}",
+  chile: "\u{1F1E8}\u{1F1F1}",
+  peru: "\u{1F1F5}\u{1F1EA}",
+  ecuador: "\u{1F1EA}\u{1F1E8}",
+  paraguay: "\u{1F1F5}\u{1F1FE}",
+  mexico: "\u{1F1F2}\u{1F1FD}",
+  "united states": "\u{1F1FA}\u{1F1F8}",
+  usa: "\u{1F1FA}\u{1F1F8}",
+  canada: "\u{1F1E8}\u{1F1E6}",
+  jamaica: "\u{1F1EF}\u{1F1F2}",
+  nigeria: "\u{1F1F3}\u{1F1EC}",
+  ghana: "\u{1F1EC}\u{1F1ED}",
+  senegal: "\u{1F1F8}\u{1F1F3}",
+  ivorycoast: "\u{1F1E8}\u{1F1EE}",
+  "cote d'ivoire": "\u{1F1E8}\u{1F1EE}",
+  "ivory coast": "\u{1F1E8}\u{1F1EE}",
+  cameroon: "\u{1F1E8}\u{1F1F2}",
+  egypt: "\u{1F1EA}\u{1F1EC}",
+  morocco: "\u{1F1F2}\u{1F1E6}",
+  algeria: "\u{1F1E9}\u{1F1FF}",
+  tunisia: "\u{1F1F9}\u{1F1F3}",
+  mali: "\u{1F1F2}\u{1F1F1}",
+  "south africa": "\u{1F1FF}\u{1F1E6}",
+  "dr congo": "\u{1F1E8}\u{1F1E9}",
+  japan: "\u{1F1EF}\u{1F1F5}",
+  "south korea": "\u{1F1F0}\u{1F1F7}",
+  korea: "\u{1F1F0}\u{1F1F7}",
+  australia: "\u{1F1E6}\u{1F1FA}",
+  "saudi arabia": "\u{1F1F8}\u{1F1E6}",
+  iran: "\u{1F1EE}\u{1F1F7}",
+  "new zealand": "\u{1F1F3}\u{1F1FF}"
+};
+function nationalityFlag(nationality) {
+  if (!nationality) return "\u{1F3F3}\uFE0F";
+  const key = nationality.trim().toLowerCase();
+  return FLAGS[key] ?? nationality.slice(0, 3).toUpperCase();
+}
+
+// src/components/games/MysteryTigerGame.tsx
 var import_jsx_runtime55 = require("react/jsx-runtime");
 function parseClientState(json) {
   if (!json) return null;
@@ -4259,6 +4342,15 @@ function verdictGlyph(v) {
   if (v.direction === "down") return "\u2193";
   return "\u2248";
 }
+function directionArrow(v) {
+  if (v.direction === "up") return "\u25B2";
+  if (v.direction === "down") return "\u25BC";
+  return "";
+}
+function tileFace(key, v) {
+  if (!v.value) return verdictGlyph(v);
+  return key === "nationality" ? nationalityFlag(v.value) : v.value;
+}
 function MysteryTigerGame({
   config,
   result,
@@ -4304,16 +4396,20 @@ function MysteryTigerGame({
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "ss-w-gtrow", children: ATTR_KEYS.map((key) => {
             const v = gr[key];
+            const arrow = directionArrow(v);
             return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
               "div",
               {
                 className: `ss-w-gtile ss-w-gtile--${v.verdict}`,
                 "data-testid": `verdict-${key}-${i}`,
                 "data-verdict": v.verdict,
-                "aria-label": `${ATTR_LABELS[key]}: ${v.verdict}${v.direction ? ` ${v.direction}` : ""}`,
+                "aria-label": `${ATTR_LABELS[key]}: ${v.value ?? v.verdict}${v.direction ? ` ${v.direction}` : ""}`,
                 children: [
                   /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "ss-w-gtile-lab", children: ATTR_LABELS[key] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "ss-w-gtile-v", "aria-hidden": "true", children: verdictGlyph(v) })
+                  /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("span", { className: "ss-w-gtile-v", "aria-hidden": "true", children: [
+                    tileFace(key, v),
+                    arrow && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "ss-w-gtile-dir", children: arrow })
+                  ] })
                 ]
               },
               key
@@ -4828,89 +4924,6 @@ function BeatTheGridGame({
 
 // src/components/games/GuessTheXiGame.tsx
 var import_react32 = require("react");
-
-// src/components/games/nationFlags.ts
-var FLAGS = {
-  england: "\u{1F3F4}\u{E0067}\u{E0062}\u{E0065}\u{E006E}\u{E0067}\u{E007F}",
-  scotland: "\u{1F3F4}\u{E0067}\u{E0062}\u{E0073}\u{E0063}\u{E0074}\u{E007F}",
-  wales: "\u{1F3F4}\u{E0067}\u{E0062}\u{E0077}\u{E006C}\u{E0073}\u{E007F}",
-  "northern ireland": "\u{1F1EC}\u{1F1E7}",
-  "republic of ireland": "\u{1F1EE}\u{1F1EA}",
-  ireland: "\u{1F1EE}\u{1F1EA}",
-  "united kingdom": "\u{1F1EC}\u{1F1E7}",
-  france: "\u{1F1EB}\u{1F1F7}",
-  spain: "\u{1F1EA}\u{1F1F8}",
-  portugal: "\u{1F1F5}\u{1F1F9}",
-  germany: "\u{1F1E9}\u{1F1EA}",
-  italy: "\u{1F1EE}\u{1F1F9}",
-  netherlands: "\u{1F1F3}\u{1F1F1}",
-  belgium: "\u{1F1E7}\u{1F1EA}",
-  switzerland: "\u{1F1E8}\u{1F1ED}",
-  austria: "\u{1F1E6}\u{1F1F9}",
-  denmark: "\u{1F1E9}\u{1F1F0}",
-  sweden: "\u{1F1F8}\u{1F1EA}",
-  norway: "\u{1F1F3}\u{1F1F4}",
-  finland: "\u{1F1EB}\u{1F1EE}",
-  iceland: "\u{1F1EE}\u{1F1F8}",
-  poland: "\u{1F1F5}\u{1F1F1}",
-  czechia: "\u{1F1E8}\u{1F1FF}",
-  "czech republic": "\u{1F1E8}\u{1F1FF}",
-  croatia: "\u{1F1ED}\u{1F1F7}",
-  serbia: "\u{1F1F7}\u{1F1F8}",
-  "bosnia and herzegovina": "\u{1F1E7}\u{1F1E6}",
-  greece: "\u{1F1EC}\u{1F1F7}",
-  romania: "\u{1F1F7}\u{1F1F4}",
-  ukraine: "\u{1F1FA}\u{1F1E6}",
-  russia: "\u{1F1F7}\u{1F1FA}",
-  hungary: "\u{1F1ED}\u{1F1FA}",
-  slovakia: "\u{1F1F8}\u{1F1F0}",
-  slovenia: "\u{1F1F8}\u{1F1EE}",
-  turkey: "\u{1F1F9}\u{1F1F7}",
-  t\u00FCrkiye: "\u{1F1F9}\u{1F1F7}",
-  albania: "\u{1F1E6}\u{1F1F1}",
-  "north macedonia": "\u{1F1F2}\u{1F1F0}",
-  brazil: "\u{1F1E7}\u{1F1F7}",
-  argentina: "\u{1F1E6}\u{1F1F7}",
-  uruguay: "\u{1F1FA}\u{1F1FE}",
-  colombia: "\u{1F1E8}\u{1F1F4}",
-  chile: "\u{1F1E8}\u{1F1F1}",
-  peru: "\u{1F1F5}\u{1F1EA}",
-  ecuador: "\u{1F1EA}\u{1F1E8}",
-  paraguay: "\u{1F1F5}\u{1F1FE}",
-  mexico: "\u{1F1F2}\u{1F1FD}",
-  "united states": "\u{1F1FA}\u{1F1F8}",
-  usa: "\u{1F1FA}\u{1F1F8}",
-  canada: "\u{1F1E8}\u{1F1E6}",
-  jamaica: "\u{1F1EF}\u{1F1F2}",
-  nigeria: "\u{1F1F3}\u{1F1EC}",
-  ghana: "\u{1F1EC}\u{1F1ED}",
-  senegal: "\u{1F1F8}\u{1F1F3}",
-  ivorycoast: "\u{1F1E8}\u{1F1EE}",
-  "cote d'ivoire": "\u{1F1E8}\u{1F1EE}",
-  "ivory coast": "\u{1F1E8}\u{1F1EE}",
-  cameroon: "\u{1F1E8}\u{1F1F2}",
-  egypt: "\u{1F1EA}\u{1F1EC}",
-  morocco: "\u{1F1F2}\u{1F1E6}",
-  algeria: "\u{1F1E9}\u{1F1FF}",
-  tunisia: "\u{1F1F9}\u{1F1F3}",
-  mali: "\u{1F1F2}\u{1F1F1}",
-  "south africa": "\u{1F1FF}\u{1F1E6}",
-  "dr congo": "\u{1F1E8}\u{1F1E9}",
-  japan: "\u{1F1EF}\u{1F1F5}",
-  "south korea": "\u{1F1F0}\u{1F1F7}",
-  korea: "\u{1F1F0}\u{1F1F7}",
-  australia: "\u{1F1E6}\u{1F1FA}",
-  "saudi arabia": "\u{1F1F8}\u{1F1E6}",
-  iran: "\u{1F1EE}\u{1F1F7}",
-  "new zealand": "\u{1F1F3}\u{1F1FF}"
-};
-function nationalityFlag(nationality) {
-  if (!nationality) return "\u{1F3F3}\uFE0F";
-  const key = nationality.trim().toLowerCase();
-  return FLAGS[key] ?? nationality.slice(0, 3).toUpperCase();
-}
-
-// src/components/games/GuessTheXiGame.tsx
 var import_jsx_runtime59 = require("react/jsx-runtime");
 function parseClientState5(json) {
   if (!json) return null;
@@ -5647,15 +5660,17 @@ function GameScreenHost({
             config: safeParseConfig(configJson)
           }
         );
-      case "beat-the-grid":
+      case "beat-the-grid": {
+        const btgConfig = safeParseConfig(configJson);
         return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
           BeatTheGridGame,
           {
             ...sharedProps,
-            config: safeParseConfig(configJson),
-            playerPool: []
+            config: btgConfig,
+            playerPool: btgConfig?.playerPool ?? []
           }
         );
+      }
       case "guess-the-xi":
         return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
           GuessTheXiGame,
@@ -6984,7 +6999,8 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 /* Verdict tiles: label on top, verdict glyph below */
 .ss-w-gtile { display: flex; flex-direction: column; align-items: center; justify-content: center; aspect-ratio: 1; border-radius: 8px; gap: 2px; min-width: 0; }
 .ss-w-gtile-lab { font-size: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; opacity: .75; }
-.ss-w-gtile-v { font-size: 15px; font-weight: 800; line-height: 1; }
+.ss-w-gtile-v { display: inline-flex; align-items: center; gap: 1px; font-size: 13px; font-weight: 800; line-height: 1; max-width: 100%; padding: 0 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.ss-w-gtile-dir { font-size: 9px; line-height: 1; }
 .ss-w-gtile--exact { background: var(--ss-w-correct); color: #062611; }
 .ss-w-gtile--near { background: var(--ss-w-accent); color: #241700; }
 .ss-w-gtile--miss { background: var(--ss-w-bubble); color: var(--ss-w-faint); border: 1px solid var(--ss-w-line); }