@sensiblestats/widget-react 0.80.0 → 0.81.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +12 -0
- package/dist/index.cjs +1380 -1009
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1380 -1009
- package/dist/index.js.map +1 -1
- package/dist/styles.css +54 -8
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// src/StatsWidget.tsx
|
|
2
|
-
import { useCallback as
|
|
2
|
+
import { useCallback as useCallback17, useEffect as useEffect29, useMemo as useMemo6, useRef as useRef24, useState as useState48 } from "react";
|
|
3
3
|
import { StatsWidgetClient } from "@sensiblestats/widget-sdk";
|
|
4
4
|
|
|
5
5
|
// src/kickoff.ts
|
|
@@ -114,6 +114,19 @@ var STRINGS = {
|
|
|
114
114
|
accordionSuspended: "Suspended",
|
|
115
115
|
tabToday: "Today",
|
|
116
116
|
sectionLive: "Live",
|
|
117
|
+
yourLeagues: "Your leagues",
|
|
118
|
+
topLeagues: "Top leagues",
|
|
119
|
+
topLeaguesSub: "Popular today.",
|
|
120
|
+
allLeagues: "All leagues",
|
|
121
|
+
searchLeaguesPlaceholder: "Search leagues or teams",
|
|
122
|
+
noLeagueResults: "No league or team matches that search.",
|
|
123
|
+
starOnLabel: "Add to Your leagues",
|
|
124
|
+
starOffLabel: "Remove from Your leagues",
|
|
125
|
+
starredToast: "Added to Your leagues.",
|
|
126
|
+
unstarredToast: "Removed from Your leagues.",
|
|
127
|
+
leagueDetailPosition: (index, total) => `${index} of ${total}`,
|
|
128
|
+
prevLeagueLabel: "Previous league",
|
|
129
|
+
nextLeagueLabel: "Next league",
|
|
117
130
|
halfTime: "HT",
|
|
118
131
|
staleStates: "Live scores can't be updated \u2014 showing the last known state.",
|
|
119
132
|
tabGames: "Games",
|
|
@@ -466,6 +479,19 @@ var STRINGS = {
|
|
|
466
479
|
accordionSuspended: "Ask\u0131da",
|
|
467
480
|
tabToday: "Bug\xFCn",
|
|
468
481
|
sectionLive: "Canl\u0131",
|
|
482
|
+
yourLeagues: "Liglerin",
|
|
483
|
+
topLeagues: "\xD6ne \xE7\u0131kan ligler",
|
|
484
|
+
topLeaguesSub: "Bug\xFCn pop\xFCler.",
|
|
485
|
+
allLeagues: "T\xFCm ligler",
|
|
486
|
+
searchLeaguesPlaceholder: "Lig veya tak\u0131m ara",
|
|
487
|
+
noLeagueResults: "Aramana uyan lig veya tak\u0131m yok.",
|
|
488
|
+
starOnLabel: "Liglerine ekle",
|
|
489
|
+
starOffLabel: "Liglerinden \xE7\u0131kar",
|
|
490
|
+
starredToast: "Liglerin b\xF6l\xFCm\xFCne eklendi.",
|
|
491
|
+
unstarredToast: "Liglerin b\xF6l\xFCm\xFCnden \xE7\u0131kar\u0131ld\u0131.",
|
|
492
|
+
leagueDetailPosition: (index, total) => `${index} / ${total}`,
|
|
493
|
+
prevLeagueLabel: "\xD6nceki lig",
|
|
494
|
+
nextLeagueLabel: "Sonraki lig",
|
|
469
495
|
halfTime: "\u0130Y",
|
|
470
496
|
staleStates: "Canl\u0131 skorlar g\xFCncellenemiyor \u2014 son bilinen durum g\xF6steriliyor.",
|
|
471
497
|
tabGames: "Oyunlar",
|
|
@@ -815,6 +841,19 @@ function normalizeUi(cfg) {
|
|
|
815
841
|
tabOdds: strings.tabOdds,
|
|
816
842
|
tabToday: strings.tabToday,
|
|
817
843
|
sectionLive: strings.sectionLive,
|
|
844
|
+
yourLeagues: strings.yourLeagues,
|
|
845
|
+
topLeagues: strings.topLeagues,
|
|
846
|
+
topLeaguesSub: strings.topLeaguesSub,
|
|
847
|
+
allLeagues: strings.allLeagues,
|
|
848
|
+
searchLeaguesPlaceholder: strings.searchLeaguesPlaceholder,
|
|
849
|
+
noLeagueResults: strings.noLeagueResults,
|
|
850
|
+
starOnLabel: strings.starOnLabel,
|
|
851
|
+
starOffLabel: strings.starOffLabel,
|
|
852
|
+
starredToast: strings.starredToast,
|
|
853
|
+
unstarredToast: strings.unstarredToast,
|
|
854
|
+
leagueDetailPosition: strings.leagueDetailPosition,
|
|
855
|
+
prevLeagueLabel: strings.prevLeagueLabel,
|
|
856
|
+
nextLeagueLabel: strings.nextLeagueLabel,
|
|
818
857
|
halfTime: strings.halfTime,
|
|
819
858
|
staleStates: strings.staleStates,
|
|
820
859
|
pinLabel: strings.pinLabel,
|
|
@@ -2716,14 +2755,14 @@ import { useCallback as useCallback4, useEffect as useEffect5, useMemo as useMem
|
|
|
2716
2755
|
|
|
2717
2756
|
// src/scheduleCache.ts
|
|
2718
2757
|
var PREFIX = "ss-w-schedule:";
|
|
2719
|
-
var SCHEMA_VERSION =
|
|
2758
|
+
var SCHEMA_VERSION = 2;
|
|
2720
2759
|
var TTL_MS2 = 6 * 36e5;
|
|
2721
|
-
function scheduleCacheKey(operatorId, localDate) {
|
|
2722
|
-
return `${PREFIX}${operatorId}:${localDate}`;
|
|
2760
|
+
function scheduleCacheKey(operatorId, encodedUserKey2, localDate) {
|
|
2761
|
+
return `${PREFIX}${operatorId}:${encodedUserKey2}:${localDate}`;
|
|
2723
2762
|
}
|
|
2724
|
-
function read(operatorId, localDate) {
|
|
2763
|
+
function read(operatorId, encodedUserKey2, localDate) {
|
|
2725
2764
|
try {
|
|
2726
|
-
const raw = localStorage.getItem(scheduleCacheKey(operatorId, localDate));
|
|
2765
|
+
const raw = localStorage.getItem(scheduleCacheKey(operatorId, encodedUserKey2, localDate));
|
|
2727
2766
|
if (!raw) return null;
|
|
2728
2767
|
const entry = JSON.parse(raw);
|
|
2729
2768
|
if (entry.v !== SCHEMA_VERSION || !entry.payload) return null;
|
|
@@ -2732,13 +2771,13 @@ function read(operatorId, localDate) {
|
|
|
2732
2771
|
return null;
|
|
2733
2772
|
}
|
|
2734
2773
|
}
|
|
2735
|
-
function readSchedule(operatorId, localDate, nowMs) {
|
|
2736
|
-
const entry = read(operatorId, localDate);
|
|
2774
|
+
function readSchedule(operatorId, encodedUserKey2, localDate, nowMs) {
|
|
2775
|
+
const entry = read(operatorId, encodedUserKey2, localDate);
|
|
2737
2776
|
if (!entry) return null;
|
|
2738
2777
|
return nowMs - entry.at > TTL_MS2 ? null : entry.payload;
|
|
2739
2778
|
}
|
|
2740
|
-
function readScheduleIgnoringTtl(operatorId, localDate) {
|
|
2741
|
-
return read(operatorId, localDate)?.payload ?? null;
|
|
2779
|
+
function readScheduleIgnoringTtl(operatorId, encodedUserKey2, localDate) {
|
|
2780
|
+
return read(operatorId, encodedUserKey2, localDate)?.payload ?? null;
|
|
2742
2781
|
}
|
|
2743
2782
|
function skeletonOnly(payload) {
|
|
2744
2783
|
return {
|
|
@@ -2746,9 +2785,13 @@ function skeletonOnly(payload) {
|
|
|
2746
2785
|
groups: payload.groups.map((g) => ({
|
|
2747
2786
|
competitionId: g.competitionId,
|
|
2748
2787
|
competitionName: g.competitionName,
|
|
2788
|
+
competitionCountry: g.competitionCountry ?? null,
|
|
2749
2789
|
competitionImagePath: g.competitionImagePath ?? null,
|
|
2750
2790
|
rank: g.rank,
|
|
2751
2791
|
expandedByDefault: g.expandedByDefault,
|
|
2792
|
+
isStarred: g.isStarred,
|
|
2793
|
+
isLearned: g.isLearned,
|
|
2794
|
+
learnedRank: g.learnedRank,
|
|
2752
2795
|
matches: g.matches.map((m) => ({
|
|
2753
2796
|
matchId: m.matchId,
|
|
2754
2797
|
homeTeamName: m.homeTeamName,
|
|
@@ -2760,9 +2803,9 @@ function skeletonOnly(payload) {
|
|
|
2760
2803
|
}))
|
|
2761
2804
|
};
|
|
2762
2805
|
}
|
|
2763
|
-
function writeSchedule(operatorId, localDate, payload, nowMs) {
|
|
2764
|
-
const keep = scheduleCacheKey(operatorId, localDate);
|
|
2765
|
-
const mine = `${PREFIX}${operatorId}:`;
|
|
2806
|
+
function writeSchedule(operatorId, encodedUserKey2, localDate, payload, nowMs) {
|
|
2807
|
+
const keep = scheduleCacheKey(operatorId, encodedUserKey2, localDate);
|
|
2808
|
+
const mine = `${PREFIX}${operatorId}:${encodedUserKey2}:`;
|
|
2766
2809
|
try {
|
|
2767
2810
|
for (let i = localStorage.length - 1; i >= 0; i--) {
|
|
2768
2811
|
const key = localStorage.key(i);
|
|
@@ -2773,6 +2816,12 @@ function writeSchedule(operatorId, localDate, payload, nowMs) {
|
|
|
2773
2816
|
} catch {
|
|
2774
2817
|
}
|
|
2775
2818
|
}
|
|
2819
|
+
function patchScheduleStar(operatorId, encodedUserKey2, localDate, competitionId, star) {
|
|
2820
|
+
const entry = read(operatorId, encodedUserKey2, localDate);
|
|
2821
|
+
if (!entry) return;
|
|
2822
|
+
const groups = entry.payload.groups.map((g) => g.competitionId === competitionId ? { ...g, ...star } : g);
|
|
2823
|
+
writeSchedule(operatorId, encodedUserKey2, localDate, { ...entry.payload, groups }, entry.at);
|
|
2824
|
+
}
|
|
2776
2825
|
|
|
2777
2826
|
// src/dueSet.ts
|
|
2778
2827
|
var TERMINAL_PHASES = /* @__PURE__ */ new Set(["fullTime", "postponed"]);
|
|
@@ -2793,6 +2842,9 @@ function dueMatchIds(groups, states, nowMs) {
|
|
|
2793
2842
|
var POLL_MS = 6e4;
|
|
2794
2843
|
var ROLLOVER_CHECK_MS = 6e4;
|
|
2795
2844
|
var STALE_AFTER_FAILURES = 2;
|
|
2845
|
+
function encodedUserKey(operatorUserId, anonymousUserId) {
|
|
2846
|
+
return encodeURIComponent(operatorUserId || anonymousUserId || "none");
|
|
2847
|
+
}
|
|
2796
2848
|
function localDateOf(now) {
|
|
2797
2849
|
const y = now.getFullYear();
|
|
2798
2850
|
const m = `${now.getMonth() + 1}`.padStart(2, "0");
|
|
@@ -2803,15 +2855,12 @@ function useMatchDiscovery(opts) {
|
|
|
2803
2855
|
const [groups, setGroups] = useState4([]);
|
|
2804
2856
|
const [states, setStates] = useState4({});
|
|
2805
2857
|
const [failures, setFailures] = useState4(0);
|
|
2806
|
-
const [expanded, setExpanded] = useState4({});
|
|
2807
|
-
const [touched, setTouched] = useState4({});
|
|
2808
2858
|
const groupsRef = useRef5(groups);
|
|
2809
2859
|
groupsRef.current = groups;
|
|
2810
2860
|
const statesRef = useRef5(states);
|
|
2811
2861
|
statesRef.current = states;
|
|
2812
2862
|
const getStatesRef = useRef5(opts.getStates);
|
|
2813
2863
|
getStatesRef.current = opts.getStates;
|
|
2814
|
-
const pinnedKey = opts.pinnedMatchIds.join(",");
|
|
2815
2864
|
const [localDate, setLocalDate] = useState4(() => localDateOf(/* @__PURE__ */ new Date()));
|
|
2816
2865
|
useEffect5(() => {
|
|
2817
2866
|
const id = setInterval(() => {
|
|
@@ -2823,7 +2872,8 @@ function useMatchDiscovery(opts) {
|
|
|
2823
2872
|
useEffect5(() => {
|
|
2824
2873
|
let cancelled = false;
|
|
2825
2874
|
const utcOffsetMinutes = -(/* @__PURE__ */ new Date()).getTimezoneOffset();
|
|
2826
|
-
const
|
|
2875
|
+
const key = encodedUserKey(opts.operatorUserId, opts.anonymousUserId);
|
|
2876
|
+
const cached = readSchedule(opts.operatorId, key, localDate, Date.now());
|
|
2827
2877
|
if (cached) {
|
|
2828
2878
|
if (!cancelled) setGroups(cached.groups);
|
|
2829
2879
|
return () => {
|
|
@@ -2834,28 +2884,17 @@ function useMatchDiscovery(opts) {
|
|
|
2834
2884
|
try {
|
|
2835
2885
|
const payload = await opts.getSchedule(localDate, utcOffsetMinutes);
|
|
2836
2886
|
if (cancelled || !payload) return;
|
|
2837
|
-
writeSchedule(opts.operatorId, localDate, payload, Date.now());
|
|
2887
|
+
writeSchedule(opts.operatorId, key, localDate, payload, Date.now());
|
|
2838
2888
|
setGroups(payload.groups);
|
|
2839
2889
|
} catch {
|
|
2840
|
-
const fallback = readScheduleIgnoringTtl(opts.operatorId, localDate);
|
|
2890
|
+
const fallback = readScheduleIgnoringTtl(opts.operatorId, key, localDate);
|
|
2841
2891
|
if (!cancelled && fallback) setGroups(fallback.groups);
|
|
2842
2892
|
}
|
|
2843
2893
|
})();
|
|
2844
2894
|
return () => {
|
|
2845
2895
|
cancelled = true;
|
|
2846
2896
|
};
|
|
2847
|
-
}, [opts.operatorId, localDate]);
|
|
2848
|
-
useEffect5(() => {
|
|
2849
|
-
setExpanded((prev) => {
|
|
2850
|
-
const next = {};
|
|
2851
|
-
for (const group of groups) {
|
|
2852
|
-
const hasPin = group.matches.some((m) => opts.pinnedMatchIds.includes(m.matchId));
|
|
2853
|
-
const seeded = group.expandedByDefault || hasPin;
|
|
2854
|
-
next[group.competitionId] = touched[group.competitionId] ? prev[group.competitionId] ?? seeded : seeded;
|
|
2855
|
-
}
|
|
2856
|
-
return next;
|
|
2857
|
-
});
|
|
2858
|
-
}, [groups, pinnedKey, touched]);
|
|
2897
|
+
}, [opts.operatorId, opts.operatorUserId, opts.anonymousUserId, localDate]);
|
|
2859
2898
|
const tick = useCallback4(async () => {
|
|
2860
2899
|
const ids = dueMatchIds(groupsRef.current, statesRef.current, Date.now());
|
|
2861
2900
|
if (ids.length === 0) return;
|
|
@@ -2885,11 +2924,20 @@ function useMatchDiscovery(opts) {
|
|
|
2885
2924
|
() => stale ? 0 : Object.values(states).filter((s) => s.phase === "live").length,
|
|
2886
2925
|
[states, stale]
|
|
2887
2926
|
);
|
|
2888
|
-
const
|
|
2889
|
-
|
|
2890
|
-
|
|
2891
|
-
|
|
2892
|
-
|
|
2927
|
+
const starLeague = useCallback4(async (competitionId, starred) => {
|
|
2928
|
+
let result;
|
|
2929
|
+
try {
|
|
2930
|
+
result = await opts.postLeagueStar(competitionId, starred);
|
|
2931
|
+
} catch {
|
|
2932
|
+
return false;
|
|
2933
|
+
}
|
|
2934
|
+
if (!result) return false;
|
|
2935
|
+
const patch = { isStarred: result.starred, isLearned: false, learnedRank: null };
|
|
2936
|
+
setGroups((prev) => prev.map((g) => g.competitionId === competitionId ? { ...g, ...patch } : g));
|
|
2937
|
+
patchScheduleStar(opts.operatorId, encodedUserKey(opts.operatorUserId, opts.anonymousUserId), localDate, competitionId, patch);
|
|
2938
|
+
return true;
|
|
2939
|
+
}, [opts.postLeagueStar, opts.operatorId, opts.operatorUserId, opts.anonymousUserId, localDate]);
|
|
2940
|
+
return { groups, states, liveCount, stale, starLeague, _tick: tick };
|
|
2893
2941
|
}
|
|
2894
2942
|
|
|
2895
2943
|
// src/useGames.ts
|
|
@@ -3363,7 +3411,7 @@ function ChatFab({ label, greeting, popupText, logoUrl, onOpen, onDismissPopup,
|
|
|
3363
3411
|
}
|
|
3364
3412
|
|
|
3365
3413
|
// src/components/ChatPanel.tsx
|
|
3366
|
-
import { useCallback as
|
|
3414
|
+
import { useCallback as useCallback16, useEffect as useEffect28, useMemo as useMemo5, useRef as useRef23, useState as useState47 } from "react";
|
|
3367
3415
|
|
|
3368
3416
|
// src/components/ChatHeader.tsx
|
|
3369
3417
|
import { useEffect as useEffect12, useRef as useRef12, useState as useState10 } from "react";
|
|
@@ -5871,16 +5919,135 @@ function OddsPanel({ monitor, ui, slip }) {
|
|
|
5871
5919
|
}) });
|
|
5872
5920
|
}
|
|
5873
5921
|
|
|
5874
|
-
// src/components/
|
|
5922
|
+
// src/components/TodayPanel.tsx
|
|
5923
|
+
import { useEffect as useEffect21, useId as useId2, useMemo as useMemo4, useState as useState29 } from "react";
|
|
5924
|
+
|
|
5925
|
+
// src/placement.ts
|
|
5926
|
+
function placeLeagues(visible, pinnedMatchIds) {
|
|
5927
|
+
const candidates = [];
|
|
5928
|
+
const candidateIds = /* @__PURE__ */ new Set();
|
|
5929
|
+
for (const g of visible) {
|
|
5930
|
+
if (g.isStarred) {
|
|
5931
|
+
candidates.push(g);
|
|
5932
|
+
candidateIds.add(g.competitionId);
|
|
5933
|
+
}
|
|
5934
|
+
}
|
|
5935
|
+
let budget = 4;
|
|
5936
|
+
const pinned = visible.find(
|
|
5937
|
+
(g) => !candidateIds.has(g.competitionId) && g.matches.some((m) => pinnedMatchIds.includes(m.matchId))
|
|
5938
|
+
) ?? null;
|
|
5939
|
+
if (pinned && budget > 0) {
|
|
5940
|
+
candidates.push(pinned);
|
|
5941
|
+
candidateIds.add(pinned.competitionId);
|
|
5942
|
+
budget -= 1;
|
|
5943
|
+
}
|
|
5944
|
+
const learned = visible.filter((g) => g.isLearned && !candidateIds.has(g.competitionId)).sort((a, b) => (a.learnedRank ?? Number.MAX_SAFE_INTEGER) - (b.learnedRank ?? Number.MAX_SAFE_INTEGER));
|
|
5945
|
+
for (const g of learned) {
|
|
5946
|
+
if (budget <= 0) break;
|
|
5947
|
+
candidates.push(g);
|
|
5948
|
+
candidateIds.add(g.competitionId);
|
|
5949
|
+
budget -= 1;
|
|
5950
|
+
}
|
|
5951
|
+
const personal = candidates.length > 0;
|
|
5952
|
+
const pool = personal ? candidates : visible.slice(0, 4);
|
|
5953
|
+
const poolIds = personal ? candidateIds : new Set(pool.map((g) => g.competitionId));
|
|
5954
|
+
const others = visible.filter((g) => !poolIds.has(g.competitionId));
|
|
5955
|
+
return { personal, candidates: pool, others, order: [...pool, ...others], pinnedCompetitionId: pinned?.competitionId ?? null };
|
|
5956
|
+
}
|
|
5957
|
+
function starClickable(group, pinnedCompetitionId) {
|
|
5958
|
+
return group.isStarred || group.competitionId !== pinnedCompetitionId;
|
|
5959
|
+
}
|
|
5960
|
+
|
|
5961
|
+
// src/search.ts
|
|
5962
|
+
function foldSearchText(s) {
|
|
5963
|
+
return s.replace(/İ/g, "I").replace(/ı/g, "i").normalize("NFD").replace(/[̀-ͯ]/g, "").toLowerCase();
|
|
5964
|
+
}
|
|
5965
|
+
function matchesQuery(group, query) {
|
|
5966
|
+
const q = foldSearchText(query.trim());
|
|
5967
|
+
if (!q) return true;
|
|
5968
|
+
if (foldSearchText(group.competitionName).includes(q)) return true;
|
|
5969
|
+
if (group.competitionCountry && foldSearchText(group.competitionCountry).includes(q)) return true;
|
|
5970
|
+
return group.matches.some(
|
|
5971
|
+
(m) => foldSearchText(m.homeTeamName).includes(q) || foldSearchText(m.awayTeamName).includes(q)
|
|
5972
|
+
);
|
|
5973
|
+
}
|
|
5974
|
+
|
|
5975
|
+
// src/useStarTap.ts
|
|
5976
|
+
import { useCallback as useCallback13, useRef as useRef17, useState as useState27 } from "react";
|
|
5977
|
+
function useStarTap(starLeague) {
|
|
5978
|
+
const [pendingId, setPendingId] = useState27(null);
|
|
5979
|
+
const pendingRef = useRef17(null);
|
|
5980
|
+
const tap = useCallback13(async (competitionId, next) => {
|
|
5981
|
+
if (pendingRef.current !== null) return false;
|
|
5982
|
+
pendingRef.current = competitionId;
|
|
5983
|
+
setPendingId(competitionId);
|
|
5984
|
+
try {
|
|
5985
|
+
return await starLeague(competitionId, next);
|
|
5986
|
+
} finally {
|
|
5987
|
+
pendingRef.current = null;
|
|
5988
|
+
setPendingId(null);
|
|
5989
|
+
}
|
|
5990
|
+
}, [starLeague]);
|
|
5991
|
+
return { pendingId, tap };
|
|
5992
|
+
}
|
|
5993
|
+
|
|
5994
|
+
// src/components/LeagueTile.tsx
|
|
5875
5995
|
import { jsx as jsx55, jsxs as jsxs50 } from "react/jsx-runtime";
|
|
5996
|
+
var STAR_PATH = "M12 2.5l2.9 5.9 6.5.95-4.7 4.58 1.1 6.47L12 17.35 6.1 20.4l1.1-6.47L2.5 9.35l6.5-.95z";
|
|
5997
|
+
function LeagueTile({ group, starClickable: starClickable2, disambiguate, onOpen, starTap, ui }) {
|
|
5998
|
+
const onStarClick = () => {
|
|
5999
|
+
void starTap.tap(group.competitionId, !group.isStarred);
|
|
6000
|
+
};
|
|
6001
|
+
return /* @__PURE__ */ jsxs50("div", { className: "ss-w-today-tile", children: [
|
|
6002
|
+
/* @__PURE__ */ jsxs50("button", { type: "button", className: "ss-w-today-tile-body", onClick: onOpen, children: [
|
|
6003
|
+
/* @__PURE__ */ jsx55(Crest2, { url: group.competitionImagePath ?? void 0, name: group.competitionName, kind: "comp" }),
|
|
6004
|
+
/* @__PURE__ */ jsxs50("span", { className: "ss-w-today-tile-name", children: [
|
|
6005
|
+
group.competitionName,
|
|
6006
|
+
disambiguate && group.competitionCountry ? /* @__PURE__ */ jsxs50("span", { className: "ss-w-today-tile-country", children: [
|
|
6007
|
+
" (",
|
|
6008
|
+
group.competitionCountry,
|
|
6009
|
+
")"
|
|
6010
|
+
] }) : null
|
|
6011
|
+
] })
|
|
6012
|
+
] }),
|
|
6013
|
+
/* @__PURE__ */ jsx55(
|
|
6014
|
+
"button",
|
|
6015
|
+
{
|
|
6016
|
+
type: "button",
|
|
6017
|
+
className: "ss-w-today-tile-star",
|
|
6018
|
+
"aria-pressed": group.isStarred,
|
|
6019
|
+
"aria-label": group.isStarred ? ui.starOffLabel : ui.starOnLabel,
|
|
6020
|
+
disabled: !starClickable2 || starTap.pendingId !== null,
|
|
6021
|
+
onClick: onStarClick,
|
|
6022
|
+
children: /* @__PURE__ */ jsx55("svg", { viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ jsx55(
|
|
6023
|
+
"path",
|
|
6024
|
+
{
|
|
6025
|
+
d: STAR_PATH,
|
|
6026
|
+
fill: group.isStarred ? "currentColor" : "none",
|
|
6027
|
+
stroke: group.isStarred ? "none" : "currentColor",
|
|
6028
|
+
strokeWidth: 2,
|
|
6029
|
+
strokeLinejoin: "round",
|
|
6030
|
+
strokeLinecap: "round"
|
|
6031
|
+
}
|
|
6032
|
+
) })
|
|
6033
|
+
}
|
|
6034
|
+
)
|
|
6035
|
+
] });
|
|
6036
|
+
}
|
|
6037
|
+
|
|
6038
|
+
// src/components/LeagueDetail.tsx
|
|
6039
|
+
import { useEffect as useEffect20, useState as useState28 } from "react";
|
|
6040
|
+
|
|
6041
|
+
// src/components/FixtureRow.tsx
|
|
6042
|
+
import { jsx as jsx56, jsxs as jsxs51 } from "react/jsx-runtime";
|
|
5876
6043
|
function kickoffLabel(kickoffUnix) {
|
|
5877
6044
|
const d = new Date(kickoffUnix * 1e3);
|
|
5878
6045
|
return `${`${d.getHours()}`.padStart(2, "0")}:${`${d.getMinutes()}`.padStart(2, "0")}`;
|
|
5879
6046
|
}
|
|
5880
6047
|
function Side({ name, crest, away = false }) {
|
|
5881
|
-
return /* @__PURE__ */
|
|
5882
|
-
crest ? /* @__PURE__ */
|
|
5883
|
-
/* @__PURE__ */
|
|
6048
|
+
return /* @__PURE__ */ jsxs51("span", { className: away ? "ss-w-drow-side ss-w-drow-side--away" : "ss-w-drow-side", children: [
|
|
6049
|
+
crest ? /* @__PURE__ */ jsx56("img", { className: "ss-w-drow-crest", src: crest, alt: "" }) : null,
|
|
6050
|
+
/* @__PURE__ */ jsx56("span", { className: "ss-w-drow-nm", children: name })
|
|
5884
6051
|
] });
|
|
5885
6052
|
}
|
|
5886
6053
|
function FixtureRow({ match, state, stale, ui, monitor }) {
|
|
@@ -5889,100 +6056,310 @@ function FixtureRow({ match, state, stale, ui, monitor }) {
|
|
|
5889
6056
|
const score = hasScore ? `${state.homeScore}\u2013${state.awayScore}` : void 0;
|
|
5890
6057
|
const ticked = state?.phase === "live" ? state.minuteLabel ?? null : null;
|
|
5891
6058
|
const when = state?.isHalfTime && !stale ? ui.halfTime : isLive ? ticked ?? "\u2014" : state?.phase === "live" ? "\u2014" : kickoffLabel(match.kickoffUnix);
|
|
5892
|
-
return /* @__PURE__ */
|
|
5893
|
-
/* @__PURE__ */
|
|
5894
|
-
/* @__PURE__ */
|
|
5895
|
-
/* @__PURE__ */
|
|
5896
|
-
/* @__PURE__ */
|
|
5897
|
-
/* @__PURE__ */
|
|
6059
|
+
return /* @__PURE__ */ jsxs51("div", { className: isLive || state?.isHalfTime ? "ss-w-drow ss-w-drow--live" : "ss-w-drow", children: [
|
|
6060
|
+
/* @__PURE__ */ jsx56("span", { className: isLive || state?.isHalfTime ? "ss-w-drow-when ss-w-drow-when--live" : "ss-w-drow-when", children: when }),
|
|
6061
|
+
/* @__PURE__ */ jsxs51("span", { className: "ss-w-drow-fx", children: [
|
|
6062
|
+
/* @__PURE__ */ jsx56(Side, { name: match.homeTeamName, crest: match.homeTeamImagePath }),
|
|
6063
|
+
/* @__PURE__ */ jsx56("span", { className: hasScore ? "ss-w-drow-sc" : "ss-w-drow-sc ss-w-drow-sc--idle", children: score ?? "\u2013" }),
|
|
6064
|
+
/* @__PURE__ */ jsx56(Side, { name: match.awayTeamName, crest: match.awayTeamImagePath, away: true })
|
|
5898
6065
|
] }),
|
|
5899
|
-
/* @__PURE__ */
|
|
6066
|
+
/* @__PURE__ */ jsx56(PinToggle, { ui, monitor, pin: { kind: "match", matchId: match.matchId } })
|
|
5900
6067
|
] });
|
|
5901
6068
|
}
|
|
5902
6069
|
|
|
5903
|
-
// src/components/
|
|
5904
|
-
import { jsx as
|
|
5905
|
-
|
|
6070
|
+
// src/components/LeagueDetail.tsx
|
|
6071
|
+
import { jsx as jsx57, jsxs as jsxs52 } from "react/jsx-runtime";
|
|
6072
|
+
var STAR_PATH2 = "M12 2.5l2.9 5.9 6.5.95-4.7 4.58 1.1 6.47L12 17.35 6.1 20.4l1.1-6.47L2.5 9.35l6.5-.95z";
|
|
6073
|
+
function LeagueDetail({ group, position, states, stale, ui, monitor, starTap, onBack, onPrev, onNext }) {
|
|
6074
|
+
const [toast, setToast] = useState28(null);
|
|
6075
|
+
useEffect20(() => {
|
|
6076
|
+
setToast(null);
|
|
6077
|
+
}, [group.competitionId]);
|
|
6078
|
+
useEffect20(() => {
|
|
6079
|
+
if (toast === null) return;
|
|
6080
|
+
const id = setTimeout(() => setToast(null), 4e3);
|
|
6081
|
+
return () => clearTimeout(id);
|
|
6082
|
+
}, [toast]);
|
|
5906
6083
|
const own = group.matches.filter((m) => !isTreatedLive(states[m.matchId], stale));
|
|
5907
|
-
const
|
|
5908
|
-
|
|
5909
|
-
|
|
5910
|
-
|
|
5911
|
-
|
|
5912
|
-
|
|
5913
|
-
|
|
5914
|
-
|
|
5915
|
-
/* @__PURE__ */
|
|
5916
|
-
|
|
5917
|
-
|
|
5918
|
-
|
|
5919
|
-
|
|
5920
|
-
|
|
5921
|
-
|
|
5922
|
-
|
|
5923
|
-
|
|
6084
|
+
const onStarClick = () => {
|
|
6085
|
+
const next = !group.isStarred;
|
|
6086
|
+
void starTap.tap(group.competitionId, next).then((ok) => {
|
|
6087
|
+
if (ok) setToast(next ? ui.starredToast : ui.unstarredToast);
|
|
6088
|
+
});
|
|
6089
|
+
};
|
|
6090
|
+
return /* @__PURE__ */ jsxs52("div", { className: "ss-w-today-detail", children: [
|
|
6091
|
+
/* @__PURE__ */ jsxs52("div", { className: "ss-w-today-detail-head", children: [
|
|
6092
|
+
/* @__PURE__ */ jsx57("button", { type: "button", className: "ss-w-today-detail-back", "aria-label": ui.back, onClick: onBack, children: /* @__PURE__ */ jsx57(ChevronIcon, {}) }),
|
|
6093
|
+
/* @__PURE__ */ jsx57(Crest2, { url: group.competitionImagePath ?? void 0, name: group.competitionName, kind: "comp" }),
|
|
6094
|
+
/* @__PURE__ */ jsx57("span", { className: "ss-w-today-detail-name", children: group.competitionName }),
|
|
6095
|
+
/* @__PURE__ */ jsx57(
|
|
6096
|
+
"button",
|
|
6097
|
+
{
|
|
6098
|
+
type: "button",
|
|
6099
|
+
className: "ss-w-today-detail-star",
|
|
6100
|
+
"aria-pressed": group.isStarred,
|
|
6101
|
+
"aria-label": group.isStarred ? ui.starOffLabel : ui.starOnLabel,
|
|
6102
|
+
disabled: starTap.pendingId !== null,
|
|
6103
|
+
onClick: onStarClick,
|
|
6104
|
+
children: /* @__PURE__ */ jsx57("svg", { viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ jsx57(
|
|
6105
|
+
"path",
|
|
6106
|
+
{
|
|
6107
|
+
d: STAR_PATH2,
|
|
6108
|
+
fill: group.isStarred ? "currentColor" : "none",
|
|
6109
|
+
stroke: group.isStarred ? "none" : "currentColor",
|
|
6110
|
+
strokeWidth: 2,
|
|
6111
|
+
strokeLinejoin: "round",
|
|
6112
|
+
strokeLinecap: "round"
|
|
6113
|
+
}
|
|
6114
|
+
) })
|
|
6115
|
+
}
|
|
6116
|
+
)
|
|
6117
|
+
] }),
|
|
6118
|
+
/* @__PURE__ */ jsxs52("div", { className: "ss-w-today-detail-nav", children: [
|
|
6119
|
+
/* @__PURE__ */ jsx57(
|
|
6120
|
+
"button",
|
|
6121
|
+
{
|
|
6122
|
+
type: "button",
|
|
6123
|
+
className: "ss-w-today-detail-prev",
|
|
6124
|
+
"aria-label": ui.prevLeagueLabel,
|
|
6125
|
+
disabled: position.index <= 1,
|
|
6126
|
+
onClick: onPrev,
|
|
6127
|
+
children: /* @__PURE__ */ jsx57(ChevronIcon, {})
|
|
6128
|
+
}
|
|
6129
|
+
),
|
|
6130
|
+
/* @__PURE__ */ jsx57("span", { className: "ss-w-today-detail-pos", children: ui.leagueDetailPosition(position.index, position.total) }),
|
|
6131
|
+
/* @__PURE__ */ jsx57(
|
|
6132
|
+
"button",
|
|
6133
|
+
{
|
|
6134
|
+
type: "button",
|
|
6135
|
+
className: "ss-w-today-detail-next",
|
|
6136
|
+
"aria-label": ui.nextLeagueLabel,
|
|
6137
|
+
disabled: position.index >= position.total,
|
|
6138
|
+
onClick: onNext,
|
|
6139
|
+
children: /* @__PURE__ */ jsx57(ChevronIcon, {})
|
|
6140
|
+
}
|
|
6141
|
+
)
|
|
5924
6142
|
] }),
|
|
5925
|
-
|
|
6143
|
+
/* @__PURE__ */ jsxs52("div", { className: "ss-w-today-detail-body", children: [
|
|
6144
|
+
/* @__PURE__ */ jsx57("span", { className: "ss-w-today-detail-count", children: own.length }),
|
|
6145
|
+
own.map((m) => /* @__PURE__ */ jsx57(FixtureRow, { match: m, state: states[m.matchId], stale, ui, monitor }, m.matchId))
|
|
6146
|
+
] }),
|
|
6147
|
+
toast !== null && /* @__PURE__ */ jsx57("p", { className: "ss-w-today-toast", role: "status", "aria-live": "polite", children: toast })
|
|
6148
|
+
] });
|
|
6149
|
+
}
|
|
6150
|
+
|
|
6151
|
+
// src/components/games/ui/icons.tsx
|
|
6152
|
+
import { jsx as jsx58 } from "react/jsx-runtime";
|
|
6153
|
+
var svg = (size, children, fill = false) => /* @__PURE__ */ jsx58(
|
|
6154
|
+
"svg",
|
|
6155
|
+
{
|
|
6156
|
+
width: size,
|
|
6157
|
+
height: size,
|
|
6158
|
+
viewBox: "0 0 24 24",
|
|
6159
|
+
fill: fill ? "currentColor" : "none",
|
|
6160
|
+
stroke: fill ? "none" : "currentColor",
|
|
6161
|
+
strokeWidth: 2.2,
|
|
6162
|
+
strokeLinecap: "round",
|
|
6163
|
+
strokeLinejoin: "round",
|
|
6164
|
+
"aria-hidden": "true",
|
|
6165
|
+
children
|
|
6166
|
+
}
|
|
6167
|
+
);
|
|
6168
|
+
var IconChevronLeft = ({ size = 20 }) => svg(size, /* @__PURE__ */ jsx58("path", { d: "M15 18l-6-6 6-6" }));
|
|
6169
|
+
var IconLock = ({ size = 14 }) => svg(size, [/* @__PURE__ */ jsx58("rect", { x: "5", y: "11", width: "14", height: "10", rx: "2" }, "a"), /* @__PURE__ */ jsx58("path", { d: "M8 11V7a4 4 0 0 1 8 0v4" }, "b")]);
|
|
6170
|
+
var IconCheck = ({ size = 14 }) => svg(size, /* @__PURE__ */ jsx58("path", { d: "M5 12l5 5 9-10" }));
|
|
6171
|
+
var IconClose = ({ size = 16 }) => svg(size, /* @__PURE__ */ jsx58("path", { d: "M6 6l12 12M18 6L6 18" }));
|
|
6172
|
+
var IconSearch = ({ size = 18 }) => svg(size, [/* @__PURE__ */ jsx58("circle", { cx: "11", cy: "11", r: "7" }, "a"), /* @__PURE__ */ jsx58("path", { d: "M20 20l-3.5-3.5" }, "b")]);
|
|
6173
|
+
var IconPlus = ({ size = 20 }) => svg(size, /* @__PURE__ */ jsx58("path", { d: "M12 5v14M5 12h14" }));
|
|
6174
|
+
var IconBulb = ({ size = 16 }) => svg(size, [/* @__PURE__ */ jsx58("path", { d: "M9 18h6M10 21h4" }, "a"), /* @__PURE__ */ jsx58("path", { d: "M12 3a6 6 0 0 0-3.5 10.9V16h7v-2.1A6 6 0 0 0 12 3z" }, "b")]);
|
|
6175
|
+
var IconArrowUp = ({ size = 12 }) => svg(size, /* @__PURE__ */ jsx58("path", { d: "M12 19V5M5 12l7-7 7 7" }));
|
|
6176
|
+
var IconArrowDown = ({ size = 12 }) => svg(size, /* @__PURE__ */ jsx58("path", { d: "M12 5v14M19 12l-7 7-7-7" }));
|
|
6177
|
+
var IconCalendar = ({ size = 18 }) => svg(size, [/* @__PURE__ */ jsx58("rect", { x: "4", y: "5", width: "16", height: "15", rx: "2" }, "a"), /* @__PURE__ */ jsx58("path", { d: "M4 10h16M9 3v4M15 3v4" }, "b")]);
|
|
6178
|
+
var IconShield = ({ size = 18 }) => svg(size, /* @__PURE__ */ jsx58("path", { d: "M12 3l7 3v6c0 5-3 8-7 9-4-1-7-4-7-9V6z" }));
|
|
6179
|
+
var IconFlag = ({ size = 18 }) => svg(size, /* @__PURE__ */ jsx58("path", { d: "M5 21V4M5 4h12l-2 4 2 4H5" }));
|
|
6180
|
+
var IconBall = ({ size = 18 }) => svg(size, [/* @__PURE__ */ jsx58("circle", { cx: "12", cy: "12", r: "9" }, "a"), /* @__PURE__ */ jsx58("path", { d: "M12 7l4 3-1.5 4.5h-5L8 10z" }, "b")]);
|
|
6181
|
+
var IconBoot = ({ size = 18 }) => svg(size, /* @__PURE__ */ jsx58("path", { d: "M4 6h6l1 6 8 3v3H4z" }));
|
|
6182
|
+
var IconGloves = ({ size = 18 }) => svg(size, /* @__PURE__ */ jsx58("path", { d: "M7 21v-8l-2-3V6a1.5 1.5 0 0 1 3 0v3V4a1.5 1.5 0 0 1 3 0v5V3.5a1.5 1.5 0 0 1 3 0V9V5a1.5 1.5 0 0 1 3 0v9l-2 3v4z" }));
|
|
6183
|
+
var IconFlame = ({ size = 16 }) => svg(size, /* @__PURE__ */ jsx58("path", { d: "M12 3c1 4 5 5 5 10a5 5 0 0 1-10 0c0-3 2-4 2-7 1.5 1 2 2 2 3 1-2 1-4 1-6z" }), true);
|
|
6184
|
+
|
|
6185
|
+
// src/components/games/ui/SearchField.tsx
|
|
6186
|
+
import { jsx as jsx59, jsxs as jsxs53 } from "react/jsx-runtime";
|
|
6187
|
+
function SearchField({ id, label, labelHidden = false, placeholder, value, onChange, disabled, inputRef, onKeyDown }) {
|
|
6188
|
+
return /* @__PURE__ */ jsxs53("div", { className: "ss-g-search", children: [
|
|
6189
|
+
/* @__PURE__ */ jsx59("label", { htmlFor: id, className: labelHidden ? "ss-g-sr" : "ss-g-search-label", children: label }),
|
|
6190
|
+
/* @__PURE__ */ jsxs53("div", { className: "ss-g-search-box", children: [
|
|
6191
|
+
/* @__PURE__ */ jsx59(IconSearch, {}),
|
|
6192
|
+
/* @__PURE__ */ jsx59(
|
|
6193
|
+
"input",
|
|
6194
|
+
{
|
|
6195
|
+
id,
|
|
6196
|
+
ref: inputRef,
|
|
6197
|
+
type: "text",
|
|
6198
|
+
autoComplete: "off",
|
|
6199
|
+
placeholder,
|
|
6200
|
+
value,
|
|
6201
|
+
disabled,
|
|
6202
|
+
onKeyDown,
|
|
6203
|
+
onChange: (e) => onChange(e.target.value)
|
|
6204
|
+
}
|
|
6205
|
+
)
|
|
6206
|
+
] })
|
|
5926
6207
|
] });
|
|
5927
6208
|
}
|
|
5928
6209
|
|
|
5929
6210
|
// src/components/TodayPanel.tsx
|
|
5930
|
-
import { Fragment as Fragment7, jsx as
|
|
6211
|
+
import { Fragment as Fragment7, jsx as jsx60, jsxs as jsxs54 } from "react/jsx-runtime";
|
|
5931
6212
|
function TodayPanel({ discovery, ui, monitor }) {
|
|
5932
|
-
const { groups, states, stale,
|
|
6213
|
+
const { groups, states, stale, starLeague } = discovery;
|
|
6214
|
+
const searchId = useId2();
|
|
6215
|
+
const [query, setQuery] = useState29("");
|
|
6216
|
+
const [selectedCompetitionId, setSelectedCompetitionId] = useState29(null);
|
|
6217
|
+
const [toast, setToast] = useState29(null);
|
|
6218
|
+
useEffect21(() => {
|
|
6219
|
+
if (toast === null) return;
|
|
6220
|
+
const id = setTimeout(() => setToast(null), 4e3);
|
|
6221
|
+
return () => clearTimeout(id);
|
|
6222
|
+
}, [toast]);
|
|
5933
6223
|
const visibleGroups = visibleGroupsOf(groups, states);
|
|
5934
|
-
const
|
|
6224
|
+
const pinnedMatchIds = useMemo4(
|
|
6225
|
+
() => monitor.pins.filter((p) => p.kind === "match").map((p) => p.matchId),
|
|
6226
|
+
[monitor.pins]
|
|
6227
|
+
);
|
|
6228
|
+
const placement = useMemo4(() => placeLeagues(visibleGroups, pinnedMatchIds), [visibleGroups, pinnedMatchIds]);
|
|
6229
|
+
const starTap = useStarTap(starLeague);
|
|
6230
|
+
const gridStarTap = useMemo4(() => ({
|
|
6231
|
+
pendingId: starTap.pendingId,
|
|
6232
|
+
tap: async (competitionId, next) => {
|
|
6233
|
+
const ok = await starTap.tap(competitionId, next);
|
|
6234
|
+
if (ok) setToast(next ? "starred" : "unstarred");
|
|
6235
|
+
return ok;
|
|
6236
|
+
}
|
|
6237
|
+
}), [starTap, starTap.pendingId]);
|
|
5935
6238
|
const nameCounts = visibleGroups.reduce((acc, g) => {
|
|
5936
6239
|
acc[g.competitionName] = (acc[g.competitionName] ?? 0) + 1;
|
|
5937
6240
|
return acc;
|
|
5938
6241
|
}, {});
|
|
5939
|
-
|
|
5940
|
-
|
|
5941
|
-
|
|
5942
|
-
|
|
5943
|
-
|
|
5944
|
-
|
|
5945
|
-
|
|
5946
|
-
|
|
5947
|
-
|
|
5948
|
-
|
|
5949
|
-
match,
|
|
5950
|
-
state: states[match.matchId],
|
|
5951
|
-
stale,
|
|
5952
|
-
ui,
|
|
5953
|
-
monitor
|
|
5954
|
-
},
|
|
5955
|
-
match.matchId
|
|
5956
|
-
)) })
|
|
6242
|
+
const openIndex = selectedCompetitionId === null ? -1 : placement.order.findIndex((g) => g.competitionId === selectedCompetitionId);
|
|
6243
|
+
const openGroup = openIndex === -1 ? void 0 : placement.order[openIndex];
|
|
6244
|
+
useEffect21(() => {
|
|
6245
|
+
if (selectedCompetitionId !== null && openGroup === void 0) setSelectedCompetitionId(null);
|
|
6246
|
+
}, [selectedCompetitionId, openGroup]);
|
|
6247
|
+
const liveRows = stale ? [] : visibleGroups.flatMap((group) => group.matches.filter((m) => isTreatedLive(states[m.matchId], stale)).map((match) => ({ match, rank: group.rank }))).sort((a, b) => a.rank - b.rank);
|
|
6248
|
+
const liveBand = liveRows.length > 0 && /* @__PURE__ */ jsxs54(Fragment7, { children: [
|
|
6249
|
+
/* @__PURE__ */ jsxs54("div", { className: "ss-w-sec-head", children: [
|
|
6250
|
+
/* @__PURE__ */ jsx60("span", { className: "ss-w-sec-dot", "aria-hidden": "true" }),
|
|
6251
|
+
ui.sectionLive
|
|
5957
6252
|
] }),
|
|
5958
|
-
|
|
5959
|
-
|
|
6253
|
+
/* @__PURE__ */ jsx60("div", { className: "ss-w-today-live", children: liveRows.map(({ match }) => /* @__PURE__ */ jsx60(
|
|
6254
|
+
FixtureRow,
|
|
5960
6255
|
{
|
|
5961
|
-
|
|
5962
|
-
|
|
5963
|
-
onToggle: () => toggleGroup(group.competitionId),
|
|
5964
|
-
disambiguate: (nameCounts[group.competitionName] ?? 0) > 1,
|
|
5965
|
-
states,
|
|
6256
|
+
match,
|
|
6257
|
+
state: states[match.matchId],
|
|
5966
6258
|
stale,
|
|
5967
6259
|
ui,
|
|
5968
6260
|
monitor
|
|
5969
6261
|
},
|
|
5970
|
-
|
|
5971
|
-
))
|
|
6262
|
+
match.matchId
|
|
6263
|
+
)) })
|
|
6264
|
+
] });
|
|
6265
|
+
if (openGroup !== void 0) {
|
|
6266
|
+
return /* @__PURE__ */ jsx60("div", { className: "ss-w-today-root", children: /* @__PURE__ */ jsxs54("div", { className: "ss-w-mon-list", children: [
|
|
6267
|
+
stale && /* @__PURE__ */ jsx60("div", { className: "ss-w-stale", children: ui.staleStates }),
|
|
6268
|
+
liveBand,
|
|
6269
|
+
/* @__PURE__ */ jsx60(
|
|
6270
|
+
LeagueDetail,
|
|
6271
|
+
{
|
|
6272
|
+
group: openGroup,
|
|
6273
|
+
position: { index: openIndex + 1, total: placement.order.length },
|
|
6274
|
+
states,
|
|
6275
|
+
stale,
|
|
6276
|
+
ui,
|
|
6277
|
+
monitor,
|
|
6278
|
+
starTap,
|
|
6279
|
+
onBack: () => setSelectedCompetitionId(null),
|
|
6280
|
+
onPrev: () => setSelectedCompetitionId(placement.order[Math.max(0, openIndex - 1)].competitionId),
|
|
6281
|
+
onNext: () => setSelectedCompetitionId(
|
|
6282
|
+
placement.order[Math.min(placement.order.length - 1, openIndex + 1)].competitionId
|
|
6283
|
+
)
|
|
6284
|
+
}
|
|
6285
|
+
)
|
|
6286
|
+
] }) });
|
|
6287
|
+
}
|
|
6288
|
+
const searching = query.trim().length > 0;
|
|
6289
|
+
const searchResults = searching ? visibleGroups.filter((g) => matchesQuery(g, query)) : [];
|
|
6290
|
+
return /* @__PURE__ */ jsxs54("div", { className: "ss-w-today-root", children: [
|
|
6291
|
+
/* @__PURE__ */ jsxs54("div", { className: "ss-w-mon-list", children: [
|
|
6292
|
+
stale && /* @__PURE__ */ jsx60("div", { className: "ss-w-stale", children: ui.staleStates }),
|
|
6293
|
+
!searching && liveBand,
|
|
6294
|
+
/* @__PURE__ */ jsx60(
|
|
6295
|
+
SearchField,
|
|
6296
|
+
{
|
|
6297
|
+
id: searchId,
|
|
6298
|
+
label: ui.searchLeaguesPlaceholder,
|
|
6299
|
+
labelHidden: true,
|
|
6300
|
+
placeholder: ui.searchLeaguesPlaceholder,
|
|
6301
|
+
value: query,
|
|
6302
|
+
onChange: setQuery
|
|
6303
|
+
}
|
|
6304
|
+
),
|
|
6305
|
+
searching ? searchResults.length === 0 ? /* @__PURE__ */ jsx60("div", { className: "ss-w-today-empty", children: ui.noLeagueResults }) : /* @__PURE__ */ jsx60("div", { className: "ss-w-today-tiles", children: searchResults.map((group) => /* @__PURE__ */ jsx60(
|
|
6306
|
+
LeagueTile,
|
|
6307
|
+
{
|
|
6308
|
+
group,
|
|
6309
|
+
starClickable: starClickable(group, placement.pinnedCompetitionId),
|
|
6310
|
+
disambiguate: (nameCounts[group.competitionName] ?? 0) > 1,
|
|
6311
|
+
onOpen: () => setSelectedCompetitionId(group.competitionId),
|
|
6312
|
+
starTap: gridStarTap,
|
|
6313
|
+
ui
|
|
6314
|
+
},
|
|
6315
|
+
group.competitionId
|
|
6316
|
+
)) }) : /* @__PURE__ */ jsxs54(Fragment7, { children: [
|
|
6317
|
+
/* @__PURE__ */ jsxs54("div", { className: "ss-w-today-sec", children: [
|
|
6318
|
+
placement.personal ? ui.yourLeagues : ui.topLeagues,
|
|
6319
|
+
!placement.personal && /* @__PURE__ */ jsx60("span", { className: "ss-w-today-sec-sub", children: ui.topLeaguesSub })
|
|
6320
|
+
] }),
|
|
6321
|
+
/* @__PURE__ */ jsx60("div", { className: "ss-w-today-tiles", children: placement.candidates.map((group) => /* @__PURE__ */ jsx60(
|
|
6322
|
+
LeagueTile,
|
|
6323
|
+
{
|
|
6324
|
+
group,
|
|
6325
|
+
starClickable: starClickable(group, placement.pinnedCompetitionId),
|
|
6326
|
+
disambiguate: (nameCounts[group.competitionName] ?? 0) > 1,
|
|
6327
|
+
onOpen: () => setSelectedCompetitionId(group.competitionId),
|
|
6328
|
+
starTap: gridStarTap,
|
|
6329
|
+
ui
|
|
6330
|
+
},
|
|
6331
|
+
group.competitionId
|
|
6332
|
+
)) }),
|
|
6333
|
+
/* @__PURE__ */ jsx60("div", { className: "ss-w-today-sec", children: ui.allLeagues }),
|
|
6334
|
+
/* @__PURE__ */ jsx60("div", { className: "ss-w-today-tiles", children: placement.others.map((group) => /* @__PURE__ */ jsx60(
|
|
6335
|
+
LeagueTile,
|
|
6336
|
+
{
|
|
6337
|
+
group,
|
|
6338
|
+
starClickable: starClickable(group, placement.pinnedCompetitionId),
|
|
6339
|
+
disambiguate: (nameCounts[group.competitionName] ?? 0) > 1,
|
|
6340
|
+
onOpen: () => setSelectedCompetitionId(group.competitionId),
|
|
6341
|
+
starTap: gridStarTap,
|
|
6342
|
+
ui
|
|
6343
|
+
},
|
|
6344
|
+
group.competitionId
|
|
6345
|
+
)) })
|
|
6346
|
+
] })
|
|
6347
|
+
] }),
|
|
6348
|
+
toast !== null && /* @__PURE__ */ jsx60("p", { className: "ss-w-today-toast", role: "status", "aria-live": "polite", children: toast === "starred" ? ui.starredToast : ui.unstarredToast })
|
|
5972
6349
|
] });
|
|
5973
6350
|
}
|
|
5974
6351
|
|
|
5975
6352
|
// src/components/GamesPanel.tsx
|
|
5976
|
-
import { useEffect as
|
|
6353
|
+
import { useEffect as useEffect25, useState as useState43 } from "react";
|
|
5977
6354
|
|
|
5978
6355
|
// src/components/GamesLoginWall.tsx
|
|
5979
|
-
import { jsx as
|
|
6356
|
+
import { jsx as jsx61 } from "react/jsx-runtime";
|
|
5980
6357
|
function GamesLoginWall({ ui }) {
|
|
5981
|
-
return /* @__PURE__ */
|
|
6358
|
+
return /* @__PURE__ */ jsx61("div", { className: "ss-w-mon-list", children: /* @__PURE__ */ jsx61("div", { className: "ss-w-games-wall", children: /* @__PURE__ */ jsx61("p", { children: ui.gamesLoginRequired }) }) });
|
|
5982
6359
|
}
|
|
5983
6360
|
|
|
5984
6361
|
// src/components/GamesHub.tsx
|
|
5985
|
-
import { useEffect as
|
|
6362
|
+
import { useEffect as useEffect22, useState as useState30 } from "react";
|
|
5986
6363
|
|
|
5987
6364
|
// src/components/games/ui/gameMeta.ts
|
|
5988
6365
|
function prettifyGameId(gameId) {
|
|
@@ -5998,108 +6375,74 @@ function splitName(full) {
|
|
|
5998
6375
|
}
|
|
5999
6376
|
|
|
6000
6377
|
// src/components/GameTileArt.tsx
|
|
6001
|
-
import { Fragment as Fragment8, jsx as
|
|
6378
|
+
import { Fragment as Fragment8, jsx as jsx62, jsxs as jsxs55 } from "react/jsx-runtime";
|
|
6002
6379
|
function GameTileArt({ gameId }) {
|
|
6003
|
-
return /* @__PURE__ */
|
|
6380
|
+
return /* @__PURE__ */ jsx62("svg", { className: "ss-g-art", viewBox: "0 0 120 74", "aria-hidden": "true", children: ART[gameId] ?? ART.default });
|
|
6004
6381
|
}
|
|
6005
|
-
var head = (cx, cy, r, cls = "ss-g-art-fg") => /* @__PURE__ */
|
|
6006
|
-
/* @__PURE__ */
|
|
6007
|
-
/* @__PURE__ */
|
|
6382
|
+
var head = (cx, cy, r, cls = "ss-g-art-fg") => /* @__PURE__ */ jsxs55("g", { className: cls, children: [
|
|
6383
|
+
/* @__PURE__ */ jsx62("circle", { cx, cy: cy - r * 0.3, r: r * 0.45 }),
|
|
6384
|
+
/* @__PURE__ */ jsx62("path", { d: `M${cx - r} ${cy + r}c0-${r * 0.8} ${r * 0.45}-${r * 1.1} ${r}-${r * 1.1}s${r} ${r * 0.3} ${r} ${r * 1.1}z` })
|
|
6008
6385
|
] });
|
|
6009
6386
|
var ART = {
|
|
6010
|
-
"mystery-tiger": /* @__PURE__ */
|
|
6387
|
+
"mystery-tiger": /* @__PURE__ */ jsxs55(Fragment8, { children: [
|
|
6011
6388
|
head(60, 38, 26, "ss-g-art-fg"),
|
|
6012
|
-
/* @__PURE__ */
|
|
6389
|
+
/* @__PURE__ */ jsx62("text", { x: "60", y: "36", className: "ss-g-art-q", textAnchor: "middle", children: "?" })
|
|
6013
6390
|
] }),
|
|
6014
|
-
"higher-or-lower": /* @__PURE__ */
|
|
6391
|
+
"higher-or-lower": /* @__PURE__ */ jsxs55(Fragment8, { children: [
|
|
6015
6392
|
head(32, 38, 20),
|
|
6016
6393
|
head(88, 38, 20),
|
|
6017
|
-
/* @__PURE__ */
|
|
6018
|
-
/* @__PURE__ */
|
|
6394
|
+
/* @__PURE__ */ jsx62("circle", { cx: "60", cy: "37", r: "11", className: "ss-g-art-accent" }),
|
|
6395
|
+
/* @__PURE__ */ jsx62("path", { d: "M57 33l3-3 3 3M57 41l3 3 3-3", className: "ss-g-art-ink" })
|
|
6019
6396
|
] }),
|
|
6020
|
-
"guess-the-xi": /* @__PURE__ */
|
|
6021
|
-
/* @__PURE__ */
|
|
6022
|
-
[[60, 60, "a"], [24, 46], [48, 46], [72, 46], [96, 46], [36, 30], [60, 30], [84, 30], [40, 14], [60, 14], [80, 14]].map(([x, y, a], i) => /* @__PURE__ */
|
|
6397
|
+
"guess-the-xi": /* @__PURE__ */ jsxs55(Fragment8, { children: [
|
|
6398
|
+
/* @__PURE__ */ jsx62("rect", { x: "8", y: "4", width: "104", height: "66", rx: "6", className: "ss-g-art-pitch" }),
|
|
6399
|
+
[[60, 60, "a"], [24, 46], [48, 46], [72, 46], [96, 46], [36, 30], [60, 30], [84, 30], [40, 14], [60, 14], [80, 14]].map(([x, y, a], i) => /* @__PURE__ */ jsx62("circle", { cx: x, cy: y, r: "4", className: a ? "ss-g-art-accent" : "ss-g-art-dot" }, i))
|
|
6023
6400
|
] }),
|
|
6024
|
-
"daily-quiz": /* @__PURE__ */
|
|
6025
|
-
"career-path": /* @__PURE__ */
|
|
6026
|
-
/* @__PURE__ */
|
|
6027
|
-
/* @__PURE__ */
|
|
6028
|
-
/* @__PURE__ */
|
|
6029
|
-
/* @__PURE__ */
|
|
6030
|
-
/* @__PURE__ */
|
|
6401
|
+
"daily-quiz": /* @__PURE__ */ jsx62(Fragment8, { children: [[14, 8], [62, 8], [14, 40], [62, 40]].map(([x, y], i) => /* @__PURE__ */ jsx62("rect", { x, y, width: "44", height: "26", rx: "5", className: i === 1 ? "ss-g-art-correct" : "ss-g-art-block" }, i)) }),
|
|
6402
|
+
"career-path": /* @__PURE__ */ jsxs55(Fragment8, { children: [
|
|
6403
|
+
/* @__PURE__ */ jsx62("path", { d: "M18 22h24v10c0 7-5 11-12 13-7-2-12-6-12-13z", className: "ss-g-art-fg" }),
|
|
6404
|
+
/* @__PURE__ */ jsx62("path", { d: "M48 37h8M84 37h8", className: "ss-g-art-line" }),
|
|
6405
|
+
/* @__PURE__ */ jsx62("path", { d: "M60 22h24v10c0 7-5 11-12 13-7-2-12-6-12-13z", className: "ss-g-art-fg" }),
|
|
6406
|
+
/* @__PURE__ */ jsx62("rect", { x: "96", y: "22", width: "18", height: "26", rx: "4", className: "ss-g-art-dash" }),
|
|
6407
|
+
/* @__PURE__ */ jsx62("text", { x: "105", y: "40", className: "ss-g-art-q", textAnchor: "middle", children: "?" })
|
|
6031
6408
|
] }),
|
|
6032
|
-
"beat-the-grid": /* @__PURE__ */
|
|
6033
|
-
"matchday-predictor": /* @__PURE__ */
|
|
6034
|
-
/* @__PURE__ */
|
|
6035
|
-
/* @__PURE__ */
|
|
6036
|
-
/* @__PURE__ */
|
|
6037
|
-
/* @__PURE__ */
|
|
6409
|
+
"beat-the-grid": /* @__PURE__ */ jsx62(Fragment8, { children: [0, 1, 2].flatMap((r) => [0, 1, 2].map((c) => /* @__PURE__ */ jsx62("rect", { x: 33 + c * 19, y: 10 + r * 19, width: "16", height: "16", rx: "3", className: (r + c) % 3 === 0 ? "ss-g-art-accent" : "ss-g-art-block" }, `${r}${c}`))) }),
|
|
6410
|
+
"matchday-predictor": /* @__PURE__ */ jsxs55(Fragment8, { children: [
|
|
6411
|
+
/* @__PURE__ */ jsx62("path", { d: "M10 20h20v9c0 6-4 9-10 11-6-2-10-5-10-11z", className: "ss-g-art-fg" }),
|
|
6412
|
+
/* @__PURE__ */ jsx62("rect", { x: "38", y: "22", width: "18", height: "24", rx: "4", className: "ss-g-art-accent-stroke" }),
|
|
6413
|
+
/* @__PURE__ */ jsx62("rect", { x: "64", y: "22", width: "18", height: "24", rx: "4", className: "ss-g-art-dash" }),
|
|
6414
|
+
/* @__PURE__ */ jsx62("path", { d: "M90 20h20v9c0 6-4 9-10 11-6-2-10-5-10-11z", className: "ss-g-art-fg" })
|
|
6038
6415
|
] }),
|
|
6039
|
-
"starting-xi": /* @__PURE__ */
|
|
6040
|
-
/* @__PURE__ */
|
|
6041
|
-
[[60, 60], [30, 46], [50, 46], [70, 46], [90, 46], [45, 30], [75, 30], [30, 16], [60, 16], [90, 16]].map(([x, y], i) => /* @__PURE__ */
|
|
6416
|
+
"starting-xi": /* @__PURE__ */ jsxs55(Fragment8, { children: [
|
|
6417
|
+
/* @__PURE__ */ jsx62("rect", { x: "8", y: "4", width: "104", height: "66", rx: "6", className: "ss-g-art-pitch" }),
|
|
6418
|
+
[[60, 60], [30, 46], [50, 46], [70, 46], [90, 46], [45, 30], [75, 30], [30, 16], [60, 16], [90, 16]].map(([x, y], i) => /* @__PURE__ */ jsx62("circle", { cx: x, cy: y, r: "5", className: i < 7 ? "ss-g-art-accent" : "ss-g-art-dash" }, i))
|
|
6042
6419
|
] }),
|
|
6043
|
-
"stat-ladder": /* @__PURE__ */
|
|
6044
|
-
"fan-motm": /* @__PURE__ */
|
|
6045
|
-
/* @__PURE__ */
|
|
6420
|
+
"stat-ladder": /* @__PURE__ */ jsx62(Fragment8, { children: [[20, 70], [34, 52], [48, 34]].map(([y, w], i) => /* @__PURE__ */ jsx62("rect", { x: "24", y, width: w, height: "12", rx: "3", className: i === 1 ? "ss-g-art-accent" : "ss-g-art-block" }, i)) }),
|
|
6421
|
+
"fan-motm": /* @__PURE__ */ jsxs55(Fragment8, { children: [
|
|
6422
|
+
/* @__PURE__ */ jsx62("circle", { cx: "60", cy: "37", r: "26", className: "ss-g-art-accent-stroke" }),
|
|
6046
6423
|
head(60, 40, 18),
|
|
6047
|
-
/* @__PURE__ */
|
|
6424
|
+
/* @__PURE__ */ jsx62("path", { d: "M84 8l2.4 5 5.4.6-4 3.7 1.1 5.4-4.9-2.7-4.9 2.7 1.1-5.4-4-3.7 5.4-.6z", className: "ss-g-art-accent" })
|
|
6048
6425
|
] }),
|
|
6049
|
-
default: /* @__PURE__ */
|
|
6426
|
+
default: /* @__PURE__ */ jsx62("circle", { cx: "60", cy: "37", r: "22", className: "ss-g-art-fg" })
|
|
6050
6427
|
};
|
|
6051
6428
|
|
|
6052
6429
|
// src/components/games/ui/Chip.tsx
|
|
6053
|
-
import { jsx as
|
|
6430
|
+
import { jsx as jsx63, jsxs as jsxs56 } from "react/jsx-runtime";
|
|
6054
6431
|
function Chip({ variant = "neutral", icon, children, className }) {
|
|
6055
|
-
return /* @__PURE__ */
|
|
6432
|
+
return /* @__PURE__ */ jsxs56("span", { className: `ss-g-chip ss-g-chip--${variant}${className ? ` ${className}` : ""}`, children: [
|
|
6056
6433
|
icon,
|
|
6057
6434
|
children
|
|
6058
6435
|
] });
|
|
6059
6436
|
}
|
|
6060
6437
|
function StatStack({ value, label }) {
|
|
6061
|
-
return /* @__PURE__ */
|
|
6062
|
-
/* @__PURE__ */
|
|
6063
|
-
/* @__PURE__ */
|
|
6438
|
+
return /* @__PURE__ */ jsxs56("span", { className: "ss-g-statstack", children: [
|
|
6439
|
+
/* @__PURE__ */ jsx63("span", { className: "ss-g-statstack-v", children: value }),
|
|
6440
|
+
/* @__PURE__ */ jsx63("span", { className: "ss-g-statstack-l", children: label })
|
|
6064
6441
|
] });
|
|
6065
6442
|
}
|
|
6066
6443
|
|
|
6067
|
-
// src/components/games/ui/icons.tsx
|
|
6068
|
-
import { jsx as jsx61 } from "react/jsx-runtime";
|
|
6069
|
-
var svg = (size, children, fill = false) => /* @__PURE__ */ jsx61(
|
|
6070
|
-
"svg",
|
|
6071
|
-
{
|
|
6072
|
-
width: size,
|
|
6073
|
-
height: size,
|
|
6074
|
-
viewBox: "0 0 24 24",
|
|
6075
|
-
fill: fill ? "currentColor" : "none",
|
|
6076
|
-
stroke: fill ? "none" : "currentColor",
|
|
6077
|
-
strokeWidth: 2.2,
|
|
6078
|
-
strokeLinecap: "round",
|
|
6079
|
-
strokeLinejoin: "round",
|
|
6080
|
-
"aria-hidden": "true",
|
|
6081
|
-
children
|
|
6082
|
-
}
|
|
6083
|
-
);
|
|
6084
|
-
var IconChevronLeft = ({ size = 20 }) => svg(size, /* @__PURE__ */ jsx61("path", { d: "M15 18l-6-6 6-6" }));
|
|
6085
|
-
var IconLock = ({ size = 14 }) => svg(size, [/* @__PURE__ */ jsx61("rect", { x: "5", y: "11", width: "14", height: "10", rx: "2" }, "a"), /* @__PURE__ */ jsx61("path", { d: "M8 11V7a4 4 0 0 1 8 0v4" }, "b")]);
|
|
6086
|
-
var IconCheck = ({ size = 14 }) => svg(size, /* @__PURE__ */ jsx61("path", { d: "M5 12l5 5 9-10" }));
|
|
6087
|
-
var IconClose = ({ size = 16 }) => svg(size, /* @__PURE__ */ jsx61("path", { d: "M6 6l12 12M18 6L6 18" }));
|
|
6088
|
-
var IconSearch = ({ size = 18 }) => svg(size, [/* @__PURE__ */ jsx61("circle", { cx: "11", cy: "11", r: "7" }, "a"), /* @__PURE__ */ jsx61("path", { d: "M20 20l-3.5-3.5" }, "b")]);
|
|
6089
|
-
var IconPlus = ({ size = 20 }) => svg(size, /* @__PURE__ */ jsx61("path", { d: "M12 5v14M5 12h14" }));
|
|
6090
|
-
var IconBulb = ({ size = 16 }) => svg(size, [/* @__PURE__ */ jsx61("path", { d: "M9 18h6M10 21h4" }, "a"), /* @__PURE__ */ jsx61("path", { d: "M12 3a6 6 0 0 0-3.5 10.9V16h7v-2.1A6 6 0 0 0 12 3z" }, "b")]);
|
|
6091
|
-
var IconArrowUp = ({ size = 12 }) => svg(size, /* @__PURE__ */ jsx61("path", { d: "M12 19V5M5 12l7-7 7 7" }));
|
|
6092
|
-
var IconArrowDown = ({ size = 12 }) => svg(size, /* @__PURE__ */ jsx61("path", { d: "M12 5v14M19 12l-7 7-7-7" }));
|
|
6093
|
-
var IconCalendar = ({ size = 18 }) => svg(size, [/* @__PURE__ */ jsx61("rect", { x: "4", y: "5", width: "16", height: "15", rx: "2" }, "a"), /* @__PURE__ */ jsx61("path", { d: "M4 10h16M9 3v4M15 3v4" }, "b")]);
|
|
6094
|
-
var IconShield = ({ size = 18 }) => svg(size, /* @__PURE__ */ jsx61("path", { d: "M12 3l7 3v6c0 5-3 8-7 9-4-1-7-4-7-9V6z" }));
|
|
6095
|
-
var IconFlag = ({ size = 18 }) => svg(size, /* @__PURE__ */ jsx61("path", { d: "M5 21V4M5 4h12l-2 4 2 4H5" }));
|
|
6096
|
-
var IconBall = ({ size = 18 }) => svg(size, [/* @__PURE__ */ jsx61("circle", { cx: "12", cy: "12", r: "9" }, "a"), /* @__PURE__ */ jsx61("path", { d: "M12 7l4 3-1.5 4.5h-5L8 10z" }, "b")]);
|
|
6097
|
-
var IconBoot = ({ size = 18 }) => svg(size, /* @__PURE__ */ jsx61("path", { d: "M4 6h6l1 6 8 3v3H4z" }));
|
|
6098
|
-
var IconGloves = ({ size = 18 }) => svg(size, /* @__PURE__ */ jsx61("path", { d: "M7 21v-8l-2-3V6a1.5 1.5 0 0 1 3 0v3V4a1.5 1.5 0 0 1 3 0v5V3.5a1.5 1.5 0 0 1 3 0V9V5a1.5 1.5 0 0 1 3 0v9l-2 3v4z" }));
|
|
6099
|
-
var IconFlame = ({ size = 16 }) => svg(size, /* @__PURE__ */ jsx61("path", { d: "M12 3c1 4 5 5 5 10a5 5 0 0 1-10 0c0-3 2-4 2-7 1.5 1 2 2 2 3 1-2 1-4 1-6z" }), true);
|
|
6100
|
-
|
|
6101
6444
|
// src/components/GameTile.tsx
|
|
6102
|
-
import { Fragment as Fragment9, jsx as
|
|
6445
|
+
import { Fragment as Fragment9, jsx as jsx64, jsxs as jsxs57 } from "react/jsx-runtime";
|
|
6103
6446
|
function tileStatus(game, ui) {
|
|
6104
6447
|
switch (game.status) {
|
|
6105
6448
|
case "locked":
|
|
@@ -6123,38 +6466,38 @@ function GameTile({ game, onOpen, ui, variant = "tile" }) {
|
|
|
6123
6466
|
const status = tileStatus(game, ui);
|
|
6124
6467
|
const disabled = DISABLED.has(game.status);
|
|
6125
6468
|
const title = gameTitle(game, ui.games.titles);
|
|
6126
|
-
const body = variant === "hero" ? /* @__PURE__ */
|
|
6127
|
-
/* @__PURE__ */
|
|
6128
|
-
/* @__PURE__ */
|
|
6129
|
-
status.tone === "new" && /* @__PURE__ */
|
|
6130
|
-
/* @__PURE__ */
|
|
6131
|
-
/* @__PURE__ */
|
|
6132
|
-
status.tone === "success" ? /* @__PURE__ */
|
|
6469
|
+
const body = variant === "hero" ? /* @__PURE__ */ jsxs57(Fragment9, { children: [
|
|
6470
|
+
/* @__PURE__ */ jsxs57("span", { className: "ss-g-hero-text", children: [
|
|
6471
|
+
/* @__PURE__ */ jsx64("span", { className: "ss-g-hero-eyebrow", children: ui.games.dailyChallenge }),
|
|
6472
|
+
status.tone === "new" && /* @__PURE__ */ jsx64(Chip, { variant: "badge", children: ui.games.newToday }),
|
|
6473
|
+
/* @__PURE__ */ jsx64("span", { className: "ss-g-hero-title", children: title }),
|
|
6474
|
+
/* @__PURE__ */ jsx64("span", { className: "ss-g-hero-sub", children: ui.games.taglines[game.gameId] ?? "" }),
|
|
6475
|
+
status.tone === "success" ? /* @__PURE__ */ jsx64("span", { className: "ss-g-tile-status", "data-tone": "success", children: status.text }) : /* @__PURE__ */ jsxs57("span", { className: "ss-g-hero-cta", children: [
|
|
6133
6476
|
status.tone === "accent" ? ui.games.resume : ui.games.playNow,
|
|
6134
6477
|
" \u2192"
|
|
6135
6478
|
] })
|
|
6136
6479
|
] }),
|
|
6137
|
-
/* @__PURE__ */
|
|
6138
|
-
] }) : variant === "wide" ? /* @__PURE__ */
|
|
6139
|
-
/* @__PURE__ */
|
|
6140
|
-
/* @__PURE__ */
|
|
6141
|
-
/* @__PURE__ */
|
|
6142
|
-
/* @__PURE__ */
|
|
6143
|
-
status.tone === "new" && /* @__PURE__ */
|
|
6480
|
+
/* @__PURE__ */ jsx64("span", { className: "ss-g-hero-art", children: /* @__PURE__ */ jsx64(GameTileArt, { gameId: game.gameId }) })
|
|
6481
|
+
] }) : variant === "wide" ? /* @__PURE__ */ jsxs57(Fragment9, { children: [
|
|
6482
|
+
/* @__PURE__ */ jsx64("span", { className: "ss-g-wide-art", children: /* @__PURE__ */ jsx64(GameTileArt, { gameId: game.gameId }) }),
|
|
6483
|
+
/* @__PURE__ */ jsxs57("span", { className: "ss-g-wide-text", children: [
|
|
6484
|
+
/* @__PURE__ */ jsx64("span", { className: "ss-g-tile-title", children: title }),
|
|
6485
|
+
/* @__PURE__ */ jsx64("span", { className: "ss-g-tile-status", "data-tone": status.tone, children: status.text }),
|
|
6486
|
+
status.tone === "new" && /* @__PURE__ */ jsx64(Chip, { variant: "badge", children: ui.games.newToday })
|
|
6144
6487
|
] }),
|
|
6145
|
-
/* @__PURE__ */
|
|
6146
|
-
] }) : /* @__PURE__ */
|
|
6147
|
-
/* @__PURE__ */
|
|
6148
|
-
/* @__PURE__ */
|
|
6149
|
-
/* @__PURE__ */
|
|
6488
|
+
/* @__PURE__ */ jsx64("span", { className: "ss-g-wide-chev", children: /* @__PURE__ */ jsx64(IconChevronLeft, { size: 18 }) })
|
|
6489
|
+
] }) : /* @__PURE__ */ jsxs57(Fragment9, { children: [
|
|
6490
|
+
/* @__PURE__ */ jsx64("span", { className: "ss-g-tile-art", children: /* @__PURE__ */ jsx64(GameTileArt, { gameId: game.gameId }) }),
|
|
6491
|
+
/* @__PURE__ */ jsx64("span", { className: "ss-g-tile-title", children: title }),
|
|
6492
|
+
/* @__PURE__ */ jsx64("span", { className: "ss-g-tile-status", "data-tone": status.tone, children: status.text })
|
|
6150
6493
|
] });
|
|
6151
6494
|
const cls = `ss-g-tile ss-g-tile--${variant}`;
|
|
6152
|
-
if (disabled) return /* @__PURE__ */
|
|
6153
|
-
return /* @__PURE__ */
|
|
6495
|
+
if (disabled) return /* @__PURE__ */ jsx64("div", { className: cls, "data-disabled": true, "aria-disabled": "true", children: body });
|
|
6496
|
+
return /* @__PURE__ */ jsx64("button", { type: "button", className: cls, "aria-label": `${title} \u2014 ${status.text}`, onClick: () => onOpen(game), children: body });
|
|
6154
6497
|
}
|
|
6155
6498
|
|
|
6156
6499
|
// src/components/GamesHub.tsx
|
|
6157
|
-
import { Fragment as Fragment10, jsx as
|
|
6500
|
+
import { Fragment as Fragment10, jsx as jsx65, jsxs as jsxs58 } from "react/jsx-runtime";
|
|
6158
6501
|
var PLAYABLE = /* @__PURE__ */ new Set(["available", "in_progress"]);
|
|
6159
6502
|
var DONE = /* @__PURE__ */ new Set(["played", "graded"]);
|
|
6160
6503
|
function pickHeroGame(games) {
|
|
@@ -6167,8 +6510,8 @@ function pickHeroGame(games) {
|
|
|
6167
6510
|
}
|
|
6168
6511
|
var tileKey = (g) => `${g.gameId}-${g.gameDay}-${g.fixtureId}`;
|
|
6169
6512
|
function GamesHub({ games, myWeeklyRow, weeklyPrize, onOpen, ui }) {
|
|
6170
|
-
const [, setTick] =
|
|
6171
|
-
|
|
6513
|
+
const [, setTick] = useState30(0);
|
|
6514
|
+
useEffect22(() => {
|
|
6172
6515
|
const id = setInterval(() => setTick((t) => t + 1), 6e4);
|
|
6173
6516
|
return () => clearInterval(id);
|
|
6174
6517
|
}, []);
|
|
@@ -6180,58 +6523,58 @@ function GamesHub({ games, myWeeklyRow, weeklyPrize, onOpen, ui }) {
|
|
|
6180
6523
|
const kickoffs = fixtures.map((g) => g.kickoffUtc).filter((k) => !!k).sort();
|
|
6181
6524
|
const todayPts = games.filter((g) => DONE.has(g.status)).reduce((s, g) => s + (g.score ?? 0), 0);
|
|
6182
6525
|
const dash = "\u2014";
|
|
6183
|
-
return /* @__PURE__ */
|
|
6184
|
-
/* @__PURE__ */
|
|
6185
|
-
/* @__PURE__ */
|
|
6186
|
-
/* @__PURE__ */
|
|
6187
|
-
/* @__PURE__ */
|
|
6188
|
-
myWeeklyRow ? /* @__PURE__ */
|
|
6189
|
-
/* @__PURE__ */
|
|
6526
|
+
return /* @__PURE__ */ jsxs58("div", { className: "ss-g-hub", children: [
|
|
6527
|
+
/* @__PURE__ */ jsxs58("div", { className: "ss-g-stats", children: [
|
|
6528
|
+
/* @__PURE__ */ jsxs58("div", { className: "ss-g-stat", children: [
|
|
6529
|
+
/* @__PURE__ */ jsx65("span", { className: "ss-g-stat-l", children: ui.games.statStreak }),
|
|
6530
|
+
/* @__PURE__ */ jsxs58("span", { className: "ss-g-stat-v", "data-testid": "stat-streak", children: [
|
|
6531
|
+
myWeeklyRow ? /* @__PURE__ */ jsxs58(Fragment10, { children: [
|
|
6532
|
+
/* @__PURE__ */ jsx65(IconFlame, {}),
|
|
6190
6533
|
myWeeklyRow.currentStreak
|
|
6191
6534
|
] }) : dash,
|
|
6192
|
-
myWeeklyRow && /* @__PURE__ */
|
|
6535
|
+
myWeeklyRow && /* @__PURE__ */ jsx65("small", { children: ui.games.unitDays })
|
|
6193
6536
|
] })
|
|
6194
6537
|
] }),
|
|
6195
|
-
/* @__PURE__ */
|
|
6196
|
-
/* @__PURE__ */
|
|
6197
|
-
/* @__PURE__ */
|
|
6538
|
+
/* @__PURE__ */ jsxs58("div", { className: "ss-g-stat", children: [
|
|
6539
|
+
/* @__PURE__ */ jsx65("span", { className: "ss-g-stat-l", children: ui.games.statToday }),
|
|
6540
|
+
/* @__PURE__ */ jsxs58("span", { className: "ss-g-stat-v ss-g-stat-v--accent", "data-testid": "stat-today", children: [
|
|
6198
6541
|
ui.games.formatPts(todayPts),
|
|
6199
|
-
/* @__PURE__ */
|
|
6542
|
+
/* @__PURE__ */ jsx65("small", { children: ui.games.unitPts })
|
|
6200
6543
|
] })
|
|
6201
6544
|
] }),
|
|
6202
|
-
/* @__PURE__ */
|
|
6203
|
-
/* @__PURE__ */
|
|
6204
|
-
/* @__PURE__ */
|
|
6545
|
+
/* @__PURE__ */ jsxs58("div", { className: "ss-g-stat", children: [
|
|
6546
|
+
/* @__PURE__ */ jsx65("span", { className: "ss-g-stat-l", children: ui.games.statRank }),
|
|
6547
|
+
/* @__PURE__ */ jsxs58("span", { className: "ss-g-stat-v", "data-testid": "stat-rank", children: [
|
|
6205
6548
|
myWeeklyRow ? `#${myWeeklyRow.rank}` : dash,
|
|
6206
|
-
myWeeklyRow && /* @__PURE__ */
|
|
6549
|
+
myWeeklyRow && /* @__PURE__ */ jsx65("small", { children: ui.games.thisWeek })
|
|
6207
6550
|
] })
|
|
6208
6551
|
] })
|
|
6209
6552
|
] }),
|
|
6210
|
-
weeklyPrize && /* @__PURE__ */
|
|
6211
|
-
hero && /* @__PURE__ */
|
|
6212
|
-
(grid.length > 0 || wide) && /* @__PURE__ */
|
|
6213
|
-
/* @__PURE__ */
|
|
6214
|
-
/* @__PURE__ */
|
|
6215
|
-
/* @__PURE__ */
|
|
6553
|
+
weeklyPrize && /* @__PURE__ */ jsx65(Chip, { variant: "accent", className: "ss-g-prize", children: weeklyPrize }),
|
|
6554
|
+
hero && /* @__PURE__ */ jsx65(GameTile, { game: hero, onOpen, ui, variant: "hero" }),
|
|
6555
|
+
(grid.length > 0 || wide) && /* @__PURE__ */ jsxs58("section", { className: "ss-g-sec", children: [
|
|
6556
|
+
/* @__PURE__ */ jsxs58("div", { className: "ss-g-sec-head", children: [
|
|
6557
|
+
/* @__PURE__ */ jsx65("h3", { children: ui.games.dailyGames }),
|
|
6558
|
+
/* @__PURE__ */ jsx65("span", { children: ui.games.newSetAtMidnight })
|
|
6216
6559
|
] }),
|
|
6217
|
-
grid.length > 0 && /* @__PURE__ */
|
|
6218
|
-
wide && /* @__PURE__ */
|
|
6560
|
+
grid.length > 0 && /* @__PURE__ */ jsx65("div", { className: "ss-g-grid", children: grid.map((g) => /* @__PURE__ */ jsx65(GameTile, { game: g, onOpen, ui }, tileKey(g))) }),
|
|
6561
|
+
wide && /* @__PURE__ */ jsx65(GameTile, { game: wide, onOpen, ui, variant: "wide" })
|
|
6219
6562
|
] }),
|
|
6220
|
-
fixtures.length > 0 && /* @__PURE__ */
|
|
6221
|
-
/* @__PURE__ */
|
|
6222
|
-
/* @__PURE__ */
|
|
6223
|
-
kickoffs[0] && /* @__PURE__ */
|
|
6563
|
+
fixtures.length > 0 && /* @__PURE__ */ jsxs58("section", { className: "ss-g-sec", children: [
|
|
6564
|
+
/* @__PURE__ */ jsxs58("div", { className: "ss-g-sec-head", children: [
|
|
6565
|
+
/* @__PURE__ */ jsx65("h3", { children: ui.games.matchdayGames }),
|
|
6566
|
+
kickoffs[0] && /* @__PURE__ */ jsx65("span", { children: ui.games.kickoffAt(ui.games.formatDayTime(kickoffs[0])) })
|
|
6224
6567
|
] }),
|
|
6225
|
-
/* @__PURE__ */
|
|
6568
|
+
/* @__PURE__ */ jsx65("div", { className: "ss-g-grid", children: fixtures.map((g) => /* @__PURE__ */ jsx65(GameTile, { game: g, onOpen, ui }, tileKey(g))) })
|
|
6226
6569
|
] })
|
|
6227
6570
|
] });
|
|
6228
6571
|
}
|
|
6229
6572
|
|
|
6230
6573
|
// src/components/GameScreenHost.tsx
|
|
6231
|
-
import { useEffect as
|
|
6574
|
+
import { useEffect as useEffect24, useRef as useRef20, useState as useState42 } from "react";
|
|
6232
6575
|
|
|
6233
6576
|
// src/useGamePlay.ts
|
|
6234
|
-
import { useCallback as
|
|
6577
|
+
import { useCallback as useCallback14, useRef as useRef18, useState as useState31 } from "react";
|
|
6235
6578
|
function toSubmitResult(payload) {
|
|
6236
6579
|
return {
|
|
6237
6580
|
// 'pending' means the play is recorded but awaiting resolution (fixture games)
|
|
@@ -6243,17 +6586,17 @@ function toSubmitResult(payload) {
|
|
|
6243
6586
|
};
|
|
6244
6587
|
}
|
|
6245
6588
|
function useGamePlay(conversation, { gameId, gameDay, fixtureId, locale, refresh }) {
|
|
6246
|
-
const [result, setResult] =
|
|
6247
|
-
const [submitting, setSubmitting] =
|
|
6248
|
-
const [rawStatus, setRawStatus] =
|
|
6249
|
-
const inFlightRef =
|
|
6250
|
-
const convRef =
|
|
6589
|
+
const [result, setResult] = useState31(null);
|
|
6590
|
+
const [submitting, setSubmitting] = useState31(false);
|
|
6591
|
+
const [rawStatus, setRawStatus] = useState31(null);
|
|
6592
|
+
const inFlightRef = useRef18(false);
|
|
6593
|
+
const convRef = useRef18(conversation);
|
|
6251
6594
|
convRef.current = conversation;
|
|
6252
|
-
const optsRef =
|
|
6595
|
+
const optsRef = useRef18({ gameId, gameDay, fixtureId, locale, refresh });
|
|
6253
6596
|
optsRef.current = { gameId, gameDay, fixtureId, locale, refresh };
|
|
6254
|
-
const resultRef =
|
|
6597
|
+
const resultRef = useRef18(null);
|
|
6255
6598
|
resultRef.current = result;
|
|
6256
|
-
const refetch =
|
|
6599
|
+
const refetch = useCallback14(async () => {
|
|
6257
6600
|
const conv = convRef.current;
|
|
6258
6601
|
if (!conv) return;
|
|
6259
6602
|
const opts = optsRef.current;
|
|
@@ -6269,7 +6612,7 @@ function useGamePlay(conversation, { gameId, gameDay, fixtureId, locale, refresh
|
|
|
6269
6612
|
} catch {
|
|
6270
6613
|
}
|
|
6271
6614
|
}, []);
|
|
6272
|
-
const submit =
|
|
6615
|
+
const submit = useCallback14(async (answerJson) => {
|
|
6273
6616
|
const conv = convRef.current;
|
|
6274
6617
|
if (!conv || inFlightRef.current) return;
|
|
6275
6618
|
inFlightRef.current = true;
|
|
@@ -6296,14 +6639,14 @@ function useGamePlay(conversation, { gameId, gameDay, fixtureId, locale, refresh
|
|
|
6296
6639
|
setSubmitting(false);
|
|
6297
6640
|
}
|
|
6298
6641
|
}, [refetch]);
|
|
6299
|
-
const hydrate =
|
|
6642
|
+
const hydrate = useCallback14(() => {
|
|
6300
6643
|
void refetch();
|
|
6301
6644
|
}, [refetch]);
|
|
6302
6645
|
return { result, submitting, submit, hydrate, rawStatus };
|
|
6303
6646
|
}
|
|
6304
6647
|
|
|
6305
6648
|
// src/components/games/MysteryTigerGame.tsx
|
|
6306
|
-
import { useState as
|
|
6649
|
+
import { useState as useState33, useId as useId3 } from "react";
|
|
6307
6650
|
|
|
6308
6651
|
// src/components/games/nationFlags.ts
|
|
6309
6652
|
var FLAGS = {
|
|
@@ -6514,8 +6857,8 @@ function isNationCode(flag) {
|
|
|
6514
6857
|
}
|
|
6515
6858
|
|
|
6516
6859
|
// src/components/games/PlayerAvatar.tsx
|
|
6517
|
-
import { useState as
|
|
6518
|
-
import { jsx as
|
|
6860
|
+
import { useState as useState32 } from "react";
|
|
6861
|
+
import { jsx as jsx66 } from "react/jsx-runtime";
|
|
6519
6862
|
function initialsOf(name) {
|
|
6520
6863
|
const parts = name.trim().split(/\s+/).filter(Boolean);
|
|
6521
6864
|
const first = parts[0];
|
|
@@ -6532,41 +6875,41 @@ function PlayerAvatar({
|
|
|
6532
6875
|
imagePath,
|
|
6533
6876
|
className
|
|
6534
6877
|
}) {
|
|
6535
|
-
const [failed, setFailed] =
|
|
6878
|
+
const [failed, setFailed] = useState32(false);
|
|
6536
6879
|
const showImage = Boolean(imagePath) && !isPlaceholderImage(imagePath) && !failed;
|
|
6537
|
-
return /* @__PURE__ */
|
|
6880
|
+
return /* @__PURE__ */ jsx66("div", { className, "aria-hidden": "true", children: showImage ? /* @__PURE__ */ jsx66("img", { src: imagePath, alt: "", loading: "lazy", onError: () => setFailed(true) }) : /* @__PURE__ */ jsx66("span", { className: "ss-w-av-initials", children: initialsOf(name) }) });
|
|
6538
6881
|
}
|
|
6539
6882
|
|
|
6540
6883
|
// src/components/games/ui/GameHeader.tsx
|
|
6541
|
-
import { jsx as
|
|
6884
|
+
import { jsx as jsx67, jsxs as jsxs59 } from "react/jsx-runtime";
|
|
6542
6885
|
function GameHeader({ title, eyebrow, right, onBack, backLabel }) {
|
|
6543
|
-
return /* @__PURE__ */
|
|
6544
|
-
onBack && /* @__PURE__ */
|
|
6545
|
-
/* @__PURE__ */
|
|
6546
|
-
eyebrow && /* @__PURE__ */
|
|
6547
|
-
/* @__PURE__ */
|
|
6886
|
+
return /* @__PURE__ */ jsxs59("div", { className: "ss-g-head", children: [
|
|
6887
|
+
onBack && /* @__PURE__ */ jsx67("button", { type: "button", className: "ss-g-back", "aria-label": backLabel, onClick: onBack, children: /* @__PURE__ */ jsx67(IconChevronLeft, {}) }),
|
|
6888
|
+
/* @__PURE__ */ jsxs59("div", { className: "ss-g-head-text", children: [
|
|
6889
|
+
eyebrow && /* @__PURE__ */ jsx67("span", { className: "ss-g-eyebrow", children: eyebrow }),
|
|
6890
|
+
/* @__PURE__ */ jsx67("h2", { className: "ss-g-title", children: title })
|
|
6548
6891
|
] }),
|
|
6549
|
-
right && /* @__PURE__ */
|
|
6892
|
+
right && /* @__PURE__ */ jsx67("div", { className: "ss-g-head-right", children: right })
|
|
6550
6893
|
] });
|
|
6551
6894
|
}
|
|
6552
6895
|
|
|
6553
6896
|
// src/components/games/ui/SegmentProgress.tsx
|
|
6554
|
-
import { jsx as
|
|
6897
|
+
import { jsx as jsx68, jsxs as jsxs60 } from "react/jsx-runtime";
|
|
6555
6898
|
function SegmentProgress({ segments, ariaLabel, leftLabel, rightLabel, right }) {
|
|
6556
|
-
return /* @__PURE__ */
|
|
6557
|
-
/* @__PURE__ */
|
|
6558
|
-
(leftLabel || rightLabel) && /* @__PURE__ */
|
|
6559
|
-
/* @__PURE__ */
|
|
6560
|
-
/* @__PURE__ */
|
|
6899
|
+
return /* @__PURE__ */ jsxs60("div", { className: "ss-g-progress", children: [
|
|
6900
|
+
/* @__PURE__ */ jsxs60("div", { className: "ss-g-progress-main", children: [
|
|
6901
|
+
(leftLabel || rightLabel) && /* @__PURE__ */ jsxs60("div", { className: "ss-g-progress-labels", children: [
|
|
6902
|
+
/* @__PURE__ */ jsx68("span", { children: leftLabel }),
|
|
6903
|
+
/* @__PURE__ */ jsx68("span", { className: "ss-g-progress-rl", children: rightLabel })
|
|
6561
6904
|
] }),
|
|
6562
|
-
/* @__PURE__ */
|
|
6905
|
+
/* @__PURE__ */ jsx68(
|
|
6563
6906
|
"div",
|
|
6564
6907
|
{
|
|
6565
6908
|
className: "ss-g-segs",
|
|
6566
6909
|
role: "img",
|
|
6567
6910
|
"aria-label": ariaLabel,
|
|
6568
6911
|
style: { gridTemplateColumns: `repeat(${segments.length}, minmax(0, 1fr))` },
|
|
6569
|
-
children: segments.map((s, i) => /* @__PURE__ */
|
|
6912
|
+
children: segments.map((s, i) => /* @__PURE__ */ jsx68("span", { className: "ss-g-seg", "data-state": s }, i))
|
|
6570
6913
|
}
|
|
6571
6914
|
)
|
|
6572
6915
|
] }),
|
|
@@ -6574,38 +6917,13 @@ function SegmentProgress({ segments, ariaLabel, leftLabel, rightLabel, right })
|
|
|
6574
6917
|
] });
|
|
6575
6918
|
}
|
|
6576
6919
|
|
|
6577
|
-
// src/components/games/ui/SearchField.tsx
|
|
6578
|
-
import { jsx as jsx67, jsxs as jsxs59 } from "react/jsx-runtime";
|
|
6579
|
-
function SearchField({ id, label, labelHidden = false, placeholder, value, onChange, disabled, inputRef, onKeyDown }) {
|
|
6580
|
-
return /* @__PURE__ */ jsxs59("div", { className: "ss-g-search", children: [
|
|
6581
|
-
/* @__PURE__ */ jsx67("label", { htmlFor: id, className: labelHidden ? "ss-g-sr" : "ss-g-search-label", children: label }),
|
|
6582
|
-
/* @__PURE__ */ jsxs59("div", { className: "ss-g-search-box", children: [
|
|
6583
|
-
/* @__PURE__ */ jsx67(IconSearch, {}),
|
|
6584
|
-
/* @__PURE__ */ jsx67(
|
|
6585
|
-
"input",
|
|
6586
|
-
{
|
|
6587
|
-
id,
|
|
6588
|
-
ref: inputRef,
|
|
6589
|
-
type: "text",
|
|
6590
|
-
autoComplete: "off",
|
|
6591
|
-
placeholder,
|
|
6592
|
-
value,
|
|
6593
|
-
disabled,
|
|
6594
|
-
onKeyDown,
|
|
6595
|
-
onChange: (e) => onChange(e.target.value)
|
|
6596
|
-
}
|
|
6597
|
-
)
|
|
6598
|
-
] })
|
|
6599
|
-
] });
|
|
6600
|
-
}
|
|
6601
|
-
|
|
6602
6920
|
// src/components/games/ui/AnswerTray.tsx
|
|
6603
|
-
import { Fragment as Fragment11, jsx as
|
|
6921
|
+
import { Fragment as Fragment11, jsx as jsx69, jsxs as jsxs61 } from "react/jsx-runtime";
|
|
6604
6922
|
function AnswerTray({ id, label, placeholder, optionsLabel, options, query, onQuery, onPick, disabled, minQuery = 0 }) {
|
|
6605
6923
|
const needle = query.trim().toLowerCase();
|
|
6606
6924
|
const shown = needle.length < minQuery ? [] : needle ? options.filter((o) => o.name.toLowerCase().includes(needle)) : options;
|
|
6607
|
-
return /* @__PURE__ */
|
|
6608
|
-
/* @__PURE__ */
|
|
6925
|
+
return /* @__PURE__ */ jsxs61(Fragment11, { children: [
|
|
6926
|
+
/* @__PURE__ */ jsx69(
|
|
6609
6927
|
SearchField,
|
|
6610
6928
|
{
|
|
6611
6929
|
id,
|
|
@@ -6617,9 +6935,9 @@ function AnswerTray({ id, label, placeholder, optionsLabel, options, query, onQu
|
|
|
6617
6935
|
disabled
|
|
6618
6936
|
}
|
|
6619
6937
|
),
|
|
6620
|
-
shown.length > 0 && /* @__PURE__ */
|
|
6938
|
+
shown.length > 0 && /* @__PURE__ */ jsx69("div", { className: "ss-g-tray", role: "listbox", "aria-label": optionsLabel, children: shown.map((o) => {
|
|
6621
6939
|
const { first, last } = splitName(o.name);
|
|
6622
|
-
return /* @__PURE__ */
|
|
6940
|
+
return /* @__PURE__ */ jsxs61(
|
|
6623
6941
|
"button",
|
|
6624
6942
|
{
|
|
6625
6943
|
type: "button",
|
|
@@ -6630,10 +6948,10 @@ function AnswerTray({ id, label, placeholder, optionsLabel, options, query, onQu
|
|
|
6630
6948
|
disabled,
|
|
6631
6949
|
onClick: () => onPick(o.id),
|
|
6632
6950
|
children: [
|
|
6633
|
-
/* @__PURE__ */
|
|
6634
|
-
/* @__PURE__ */
|
|
6635
|
-
first && /* @__PURE__ */
|
|
6636
|
-
/* @__PURE__ */
|
|
6951
|
+
/* @__PURE__ */ jsx69(PlayerAvatar, { className: "ss-g-tray-av", name: o.name, imagePath: o.imagePath }),
|
|
6952
|
+
/* @__PURE__ */ jsxs61("span", { className: "ss-g-tray-name", "aria-hidden": "true", children: [
|
|
6953
|
+
first && /* @__PURE__ */ jsx69("span", { className: "ss-g-tray-first", children: first }),
|
|
6954
|
+
/* @__PURE__ */ jsx69("span", { className: "ss-g-tray-last", children: last })
|
|
6637
6955
|
] })
|
|
6638
6956
|
]
|
|
6639
6957
|
},
|
|
@@ -6644,59 +6962,59 @@ function AnswerTray({ id, label, placeholder, optionsLabel, options, query, onQu
|
|
|
6644
6962
|
}
|
|
6645
6963
|
|
|
6646
6964
|
// src/components/games/ui/FooterBar.tsx
|
|
6647
|
-
import { jsx as
|
|
6965
|
+
import { jsx as jsx70 } from "react/jsx-runtime";
|
|
6648
6966
|
function FooterBar({ children }) {
|
|
6649
|
-
return /* @__PURE__ */
|
|
6967
|
+
return /* @__PURE__ */ jsx70("div", { className: "ss-g-footer", children });
|
|
6650
6968
|
}
|
|
6651
6969
|
|
|
6652
6970
|
// src/components/games/ui/Silhouette.tsx
|
|
6653
|
-
import { jsx as
|
|
6971
|
+
import { jsx as jsx71, jsxs as jsxs62 } from "react/jsx-runtime";
|
|
6654
6972
|
function Silhouette({ size, variant = "default" }) {
|
|
6655
|
-
return /* @__PURE__ */
|
|
6656
|
-
/* @__PURE__ */
|
|
6657
|
-
/* @__PURE__ */
|
|
6658
|
-
/* @__PURE__ */
|
|
6973
|
+
return /* @__PURE__ */ jsxs62("span", { className: `ss-g-sil ss-g-sil--${variant}`, style: { width: size, height: size }, "aria-hidden": "true", children: [
|
|
6974
|
+
/* @__PURE__ */ jsxs62("svg", { width: size * 0.86, height: size * 0.86, viewBox: "0 0 100 100", children: [
|
|
6975
|
+
/* @__PURE__ */ jsx71("circle", { cx: "50", cy: "40", r: "19", fill: "currentColor" }),
|
|
6976
|
+
/* @__PURE__ */ jsx71("path", { d: "M12 100c0-23 17-38 38-38s38 15 38 38z", fill: "currentColor" })
|
|
6659
6977
|
] }),
|
|
6660
|
-
variant === "mystery" && /* @__PURE__ */
|
|
6978
|
+
variant === "mystery" && /* @__PURE__ */ jsx71("span", { className: "ss-g-sil-q", children: "?" })
|
|
6661
6979
|
] });
|
|
6662
6980
|
}
|
|
6663
6981
|
|
|
6664
6982
|
// src/components/games/ui/GameButton.tsx
|
|
6665
|
-
import { jsx as
|
|
6983
|
+
import { jsx as jsx72 } from "react/jsx-runtime";
|
|
6666
6984
|
function GameButton({ variant = "primary", block = false, className, type = "button", ...rest }) {
|
|
6667
6985
|
const cls = `ss-g-btn ss-g-btn--${variant}${block ? " ss-g-btn--block" : ""}${className ? ` ${className}` : ""}`;
|
|
6668
|
-
return /* @__PURE__ */
|
|
6986
|
+
return /* @__PURE__ */ jsx72("button", { type, className: cls, ...rest });
|
|
6669
6987
|
}
|
|
6670
6988
|
|
|
6671
6989
|
// src/components/games/ui/ResultCard.tsx
|
|
6672
|
-
import { jsx as
|
|
6990
|
+
import { jsx as jsx73, jsxs as jsxs63 } from "react/jsx-runtime";
|
|
6673
6991
|
function ResultCard({ tone, title, score, detail, onBack, ui }) {
|
|
6674
|
-
return /* @__PURE__ */
|
|
6675
|
-
/* @__PURE__ */
|
|
6676
|
-
score !== void 0 && /* @__PURE__ */
|
|
6677
|
-
/* @__PURE__ */
|
|
6992
|
+
return /* @__PURE__ */ jsxs63("div", { className: "ss-g-result", "data-tone": tone, role: "status", children: [
|
|
6993
|
+
/* @__PURE__ */ jsx73("span", { className: "ss-g-result-title", children: title }),
|
|
6994
|
+
score !== void 0 && /* @__PURE__ */ jsxs63("span", { className: "ss-g-result-score", children: [
|
|
6995
|
+
/* @__PURE__ */ jsx73("span", { className: "ss-g-result-num", children: score }),
|
|
6678
6996
|
ui.games.unitPts
|
|
6679
6997
|
] }),
|
|
6680
|
-
detail && /* @__PURE__ */
|
|
6681
|
-
onBack && /* @__PURE__ */
|
|
6998
|
+
detail && /* @__PURE__ */ jsx73("span", { className: "ss-g-result-detail", children: detail }),
|
|
6999
|
+
onBack && /* @__PURE__ */ jsx73(GameButton, { variant: "outline", onClick: onBack, children: ui.games.backToGames })
|
|
6682
7000
|
] });
|
|
6683
7001
|
}
|
|
6684
7002
|
|
|
6685
7003
|
// src/components/games/ui/PointsLadderRow.tsx
|
|
6686
|
-
import { jsx as
|
|
7004
|
+
import { jsx as jsx74, jsxs as jsxs64 } from "react/jsx-runtime";
|
|
6687
7005
|
function PointsLadderRow({ ladder, guessesUsed, ui }) {
|
|
6688
7006
|
if (!ladder || ladder.length === 0) return null;
|
|
6689
7007
|
const now = ladder[Math.min(guessesUsed, ladder.length - 1)];
|
|
6690
7008
|
const next = ladder[guessesUsed + 1];
|
|
6691
7009
|
if (now === void 0) return null;
|
|
6692
|
-
return /* @__PURE__ */
|
|
6693
|
-
/* @__PURE__ */
|
|
6694
|
-
next !== void 0 && next !== now && /* @__PURE__ */
|
|
7010
|
+
return /* @__PURE__ */ jsxs64("div", { className: "ss-g-worth", "data-testid": "points-ladder", children: [
|
|
7011
|
+
/* @__PURE__ */ jsx74("span", { className: "ss-g-worth-now", children: ui.games.worthNow(now) }),
|
|
7012
|
+
next !== void 0 && next !== now && /* @__PURE__ */ jsx74("span", { className: "ss-g-worth-next", children: ui.games.worthAfterMiss(next) })
|
|
6695
7013
|
] });
|
|
6696
7014
|
}
|
|
6697
7015
|
|
|
6698
7016
|
// src/components/games/MysteryTigerGame.tsx
|
|
6699
|
-
import { Fragment as Fragment12, jsx as
|
|
7017
|
+
import { Fragment as Fragment12, jsx as jsx75, jsxs as jsxs65 } from "react/jsx-runtime";
|
|
6700
7018
|
function parseClientState(json) {
|
|
6701
7019
|
if (!json) return null;
|
|
6702
7020
|
try {
|
|
@@ -6798,8 +7116,8 @@ function MysteryTigerGame({
|
|
|
6798
7116
|
onBack
|
|
6799
7117
|
}) {
|
|
6800
7118
|
const t = ui.games.mysteryTiger;
|
|
6801
|
-
const [query, setQuery] =
|
|
6802
|
-
const inputId =
|
|
7119
|
+
const [query, setQuery] = useState33("");
|
|
7120
|
+
const inputId = useId3();
|
|
6803
7121
|
const clientState = parseClientState(result?.clientStateJson);
|
|
6804
7122
|
const guessResults = clientState?.guessResults ?? [];
|
|
6805
7123
|
const alreadyGuessedIds = new Set(guessResults.map((g) => g.playerId));
|
|
@@ -6818,22 +7136,22 @@ function MysteryTigerGame({
|
|
|
6818
7136
|
setQuery("");
|
|
6819
7137
|
onSubmit(JSON.stringify({ guesses: newGuesses }));
|
|
6820
7138
|
}
|
|
6821
|
-
const headerRight = !config ? void 0 : isOver ? /* @__PURE__ */
|
|
7139
|
+
const headerRight = !config ? void 0 : isOver ? /* @__PURE__ */ jsxs65(Chip, { variant: "accent", children: [
|
|
6822
7140
|
score,
|
|
6823
7141
|
" ",
|
|
6824
7142
|
ui.games.unitPts
|
|
6825
|
-
] }) : /* @__PURE__ */
|
|
7143
|
+
] }) : /* @__PURE__ */ jsx75("span", { "data-testid": "mt-chip", children: /* @__PURE__ */ jsxs65(Chip, { children: [
|
|
6826
7144
|
ui.games.guess,
|
|
6827
7145
|
" ",
|
|
6828
|
-
/* @__PURE__ */
|
|
7146
|
+
/* @__PURE__ */ jsx75("span", { className: "ss-g-num", children: guessesUsed + 1 }),
|
|
6829
7147
|
" / ",
|
|
6830
7148
|
totalGuesses
|
|
6831
7149
|
] }) });
|
|
6832
7150
|
const segments = Array.from({ length: totalGuesses }, (_, i) => i < guessesUsed ? "done" : i === guessesUsed ? "current" : "todo");
|
|
6833
7151
|
const cols = { gridTemplateColumns: `minmax(0, 1fr) repeat(${keys.length}, 42px)` };
|
|
6834
7152
|
const known = deriveKnownAttributes(guessResults, keys);
|
|
6835
|
-
return /* @__PURE__ */
|
|
6836
|
-
/* @__PURE__ */
|
|
7153
|
+
return /* @__PURE__ */ jsxs65("div", { className: "ss-g-screen ss-g-mt", "data-game": "mystery-tiger", "data-testid": "game-screen-mystery-tiger", children: [
|
|
7154
|
+
/* @__PURE__ */ jsx75(
|
|
6837
7155
|
GameHeader,
|
|
6838
7156
|
{
|
|
6839
7157
|
title: gameTitle({ gameId: "mystery-tiger" }, ui.games.titles),
|
|
@@ -6843,41 +7161,41 @@ function MysteryTigerGame({
|
|
|
6843
7161
|
backLabel: ui.back
|
|
6844
7162
|
}
|
|
6845
7163
|
),
|
|
6846
|
-
!config && /* @__PURE__ */
|
|
6847
|
-
config && /* @__PURE__ */
|
|
6848
|
-
/* @__PURE__ */
|
|
6849
|
-
!isOver && /* @__PURE__ */
|
|
6850
|
-
/* @__PURE__ */
|
|
6851
|
-
/* @__PURE__ */
|
|
6852
|
-
revealName ? /* @__PURE__ */
|
|
6853
|
-
revealName && /* @__PURE__ */
|
|
7164
|
+
!config && /* @__PURE__ */ jsx75("div", { className: "ss-g-body ss-g-loading", children: ui.games.loading }),
|
|
7165
|
+
config && /* @__PURE__ */ jsxs65(Fragment12, { children: [
|
|
7166
|
+
/* @__PURE__ */ jsxs65("div", { className: "ss-g-body", children: [
|
|
7167
|
+
!isOver && /* @__PURE__ */ jsx75(PointsLadderRow, { ladder: config.pointsLadder, guessesUsed, ui }),
|
|
7168
|
+
/* @__PURE__ */ jsxs65("div", { className: `ss-g-mt-card${isOver ? " ss-g-mt-card--reveal" : ""}`, children: [
|
|
7169
|
+
/* @__PURE__ */ jsxs65("div", { className: "ss-g-mt-portrait", children: [
|
|
7170
|
+
revealName ? /* @__PURE__ */ jsx75(PlayerAvatar, { className: "ss-g-mt-photo", name: revealName, imagePath: clientState?.revealedPlayerImagePath }) : /* @__PURE__ */ jsx75(Silhouette, { size: 150, variant: "mystery" }),
|
|
7171
|
+
revealName && /* @__PURE__ */ jsx75("span", { className: "ss-g-mt-reveal-name", children: revealName })
|
|
6854
7172
|
] }),
|
|
6855
|
-
/* @__PURE__ */
|
|
6856
|
-
/* @__PURE__ */
|
|
6857
|
-
/* @__PURE__ */
|
|
7173
|
+
/* @__PURE__ */ jsx75("div", { className: "ss-g-mt-known", style: { gridTemplateColumns: `repeat(${keys.length}, minmax(0, 1fr))` }, children: known.map((k) => /* @__PURE__ */ jsxs65("div", { className: "ss-g-mt-known-cell", children: [
|
|
7174
|
+
/* @__PURE__ */ jsx75("span", { className: "ss-g-mt-lab", children: t.labels[k.key] }),
|
|
7175
|
+
/* @__PURE__ */ jsx75("span", { className: "ss-g-mt-known-v", "data-state": k.state, "data-testid": `known-${k.key}`, children: k.text })
|
|
6858
7176
|
] }, k.key)) })
|
|
6859
7177
|
] }),
|
|
6860
|
-
!isOver && /* @__PURE__ */
|
|
6861
|
-
guessResults.length > 0 && /* @__PURE__ */
|
|
6862
|
-
/* @__PURE__ */
|
|
6863
|
-
/* @__PURE__ */
|
|
6864
|
-
keys.map((k) => /* @__PURE__ */
|
|
7178
|
+
!isOver && /* @__PURE__ */ jsx75(SegmentProgress, { segments, ariaLabel: t.progress(guessesUsed, totalGuesses) }),
|
|
7179
|
+
guessResults.length > 0 && /* @__PURE__ */ jsxs65("div", { className: "ss-g-mt-table", children: [
|
|
7180
|
+
/* @__PURE__ */ jsxs65("div", { className: "ss-g-mt-thead", style: cols, children: [
|
|
7181
|
+
/* @__PURE__ */ jsx75("span", { children: t.yourGuesses }),
|
|
7182
|
+
keys.map((k) => /* @__PURE__ */ jsx75("span", { children: t.labels[k] }, k))
|
|
6865
7183
|
] }),
|
|
6866
7184
|
guessResults.map((gr, i) => {
|
|
6867
7185
|
const name = config.squadPlayers.find((p) => p.id === gr.playerId)?.name ?? `#${gr.playerId}`;
|
|
6868
7186
|
const { first, last } = splitName(name);
|
|
6869
|
-
return /* @__PURE__ */
|
|
6870
|
-
/* @__PURE__ */
|
|
6871
|
-
/* @__PURE__ */
|
|
6872
|
-
/* @__PURE__ */
|
|
6873
|
-
first && /* @__PURE__ */
|
|
6874
|
-
/* @__PURE__ */
|
|
7187
|
+
return /* @__PURE__ */ jsxs65("div", { className: "ss-g-mt-row", style: cols, children: [
|
|
7188
|
+
/* @__PURE__ */ jsxs65("div", { className: "ss-g-mt-who", children: [
|
|
7189
|
+
/* @__PURE__ */ jsx75(PlayerAvatar, { className: "ss-g-mt-av", name }),
|
|
7190
|
+
/* @__PURE__ */ jsxs65("span", { className: "ss-g-mt-names", children: [
|
|
7191
|
+
first && /* @__PURE__ */ jsx75("span", { className: "ss-g-mt-first", children: first }),
|
|
7192
|
+
/* @__PURE__ */ jsx75("span", { className: "ss-g-mt-last", children: last })
|
|
6875
7193
|
] })
|
|
6876
7194
|
] }),
|
|
6877
7195
|
keys.map((key) => {
|
|
6878
7196
|
const v = gr[key];
|
|
6879
7197
|
const arrow = directionArrow(v);
|
|
6880
|
-
return /* @__PURE__ */
|
|
7198
|
+
return /* @__PURE__ */ jsxs65(
|
|
6881
7199
|
"div",
|
|
6882
7200
|
{
|
|
6883
7201
|
className: "ss-g-mt-cell",
|
|
@@ -6885,8 +7203,8 @@ function MysteryTigerGame({
|
|
|
6885
7203
|
"data-verdict": v.verdict,
|
|
6886
7204
|
"aria-label": `${t.labels[key]}: ${v.value ?? v.verdict}${v.direction ? ` ${v.direction}` : ""}`,
|
|
6887
7205
|
children: [
|
|
6888
|
-
/* @__PURE__ */
|
|
6889
|
-
arrow && /* @__PURE__ */
|
|
7206
|
+
/* @__PURE__ */ jsx75("span", { className: "ss-g-mt-cell-v", "aria-hidden": "true", children: tileFace(key, v) }),
|
|
7207
|
+
arrow && /* @__PURE__ */ jsx75("span", { className: "ss-g-mt-cell-dir", "aria-hidden": "true", children: arrow })
|
|
6890
7208
|
]
|
|
6891
7209
|
},
|
|
6892
7210
|
key
|
|
@@ -6895,25 +7213,25 @@ function MysteryTigerGame({
|
|
|
6895
7213
|
] }, gr.playerId);
|
|
6896
7214
|
})
|
|
6897
7215
|
] }),
|
|
6898
|
-
!isOver && /* @__PURE__ */
|
|
6899
|
-
/* @__PURE__ */
|
|
6900
|
-
/* @__PURE__ */
|
|
7216
|
+
!isOver && /* @__PURE__ */ jsxs65("div", { className: "ss-g-mt-legend", children: [
|
|
7217
|
+
/* @__PURE__ */ jsxs65("span", { children: [
|
|
7218
|
+
/* @__PURE__ */ jsx75("i", { className: "ss-g-mt-sw", "data-verdict": "exact" }),
|
|
6901
7219
|
t.legendMatch
|
|
6902
7220
|
] }),
|
|
6903
|
-
/* @__PURE__ */
|
|
6904
|
-
/* @__PURE__ */
|
|
7221
|
+
/* @__PURE__ */ jsxs65("span", { children: [
|
|
7222
|
+
/* @__PURE__ */ jsx75("i", { className: "ss-g-mt-sw", "data-verdict": "near" }),
|
|
6905
7223
|
t.legendClose
|
|
6906
7224
|
] }),
|
|
6907
|
-
/* @__PURE__ */
|
|
7225
|
+
/* @__PURE__ */ jsxs65("span", { children: [
|
|
6908
7226
|
"\u25B2 ",
|
|
6909
7227
|
t.legendHigher
|
|
6910
7228
|
] })
|
|
6911
7229
|
] }),
|
|
6912
|
-
clientState?.hintLine && !isOver && /* @__PURE__ */
|
|
6913
|
-
/* @__PURE__ */
|
|
6914
|
-
/* @__PURE__ */
|
|
7230
|
+
clientState?.hintLine && !isOver && /* @__PURE__ */ jsxs65("div", { className: "ss-g-mt-hint", children: [
|
|
7231
|
+
/* @__PURE__ */ jsx75(IconBulb, {}),
|
|
7232
|
+
/* @__PURE__ */ jsx75("span", { children: clientState.hintLine })
|
|
6915
7233
|
] }),
|
|
6916
|
-
isOver && /* @__PURE__ */
|
|
7234
|
+
isOver && /* @__PURE__ */ jsx75(
|
|
6917
7235
|
ResultCard,
|
|
6918
7236
|
{
|
|
6919
7237
|
tone: clientState?.solved ? "win" : clientState?.failed ? "lose" : "neutral",
|
|
@@ -6925,7 +7243,7 @@ function MysteryTigerGame({
|
|
|
6925
7243
|
}
|
|
6926
7244
|
)
|
|
6927
7245
|
] }),
|
|
6928
|
-
!isOver && /* @__PURE__ */
|
|
7246
|
+
!isOver && /* @__PURE__ */ jsx75(FooterBar, { children: /* @__PURE__ */ jsx75(
|
|
6929
7247
|
AnswerTray,
|
|
6930
7248
|
{
|
|
6931
7249
|
id: inputId,
|
|
@@ -6944,7 +7262,7 @@ function MysteryTigerGame({
|
|
|
6944
7262
|
}
|
|
6945
7263
|
|
|
6946
7264
|
// src/components/games/HigherOrLowerGame.tsx
|
|
6947
|
-
import { Fragment as Fragment13, jsx as
|
|
7265
|
+
import { Fragment as Fragment13, jsx as jsx76, jsxs as jsxs66 } from "react/jsx-runtime";
|
|
6948
7266
|
var POINTS_PER_CORRECT = 10;
|
|
6949
7267
|
function parseClientState2(json) {
|
|
6950
7268
|
if (!json) return null;
|
|
@@ -6956,11 +7274,11 @@ function parseClientState2(json) {
|
|
|
6956
7274
|
}
|
|
6957
7275
|
function PlayerCard({ name, imagePath, highlight, children }) {
|
|
6958
7276
|
const { first, last } = splitName(name);
|
|
6959
|
-
return /* @__PURE__ */
|
|
6960
|
-
/* @__PURE__ */
|
|
6961
|
-
/* @__PURE__ */
|
|
6962
|
-
first && /* @__PURE__ */
|
|
6963
|
-
/* @__PURE__ */
|
|
7277
|
+
return /* @__PURE__ */ jsxs66("div", { className: `ss-g-hl-card${highlight ? " ss-g-hl-card--b" : ""}`, children: [
|
|
7278
|
+
/* @__PURE__ */ jsx76("div", { className: "ss-g-hl-photo-wrap", children: imagePath ? /* @__PURE__ */ jsx76(PlayerAvatar, { className: "ss-g-hl-photo", name, imagePath }) : /* @__PURE__ */ jsx76(Silhouette, { size: 150 }) }),
|
|
7279
|
+
/* @__PURE__ */ jsxs66("div", { className: "ss-g-hl-info", children: [
|
|
7280
|
+
first && /* @__PURE__ */ jsx76("span", { className: "ss-g-hl-first", children: first }),
|
|
7281
|
+
/* @__PURE__ */ jsx76("span", { className: "ss-g-hl-surname", children: last }),
|
|
6964
7282
|
children
|
|
6965
7283
|
] })
|
|
6966
7284
|
] });
|
|
@@ -6992,47 +7310,47 @@ function HigherOrLowerGame({
|
|
|
6992
7310
|
const newAnswers = [...prevAnswers, { pairIndex: currentPair.pairIndex, pick }];
|
|
6993
7311
|
onSubmit(JSON.stringify({ answers: newAnswers }));
|
|
6994
7312
|
}
|
|
6995
|
-
return /* @__PURE__ */
|
|
6996
|
-
/* @__PURE__ */
|
|
7313
|
+
return /* @__PURE__ */ jsxs66("div", { className: "ss-g-screen ss-g-hl", "data-game": "higher-or-lower", "data-testid": "game-screen-higher-or-lower", children: [
|
|
7314
|
+
/* @__PURE__ */ jsx76(
|
|
6997
7315
|
GameHeader,
|
|
6998
7316
|
{
|
|
6999
7317
|
title: gameTitle({ gameId: "higher-or-lower" }, ui.games.titles),
|
|
7000
7318
|
eyebrow: t.eyebrow(POINTS_PER_CORRECT),
|
|
7001
|
-
right: config ? /* @__PURE__ */
|
|
7319
|
+
right: config ? /* @__PURE__ */ jsx76(StatStack, { value: runLength, label: t.streak }) : void 0,
|
|
7002
7320
|
onBack,
|
|
7003
7321
|
backLabel: ui.back
|
|
7004
7322
|
}
|
|
7005
7323
|
),
|
|
7006
|
-
!config && /* @__PURE__ */
|
|
7007
|
-
config && /* @__PURE__ */
|
|
7008
|
-
/* @__PURE__ */
|
|
7009
|
-
/* @__PURE__ */
|
|
7010
|
-
/* @__PURE__ */
|
|
7011
|
-
/* @__PURE__ */
|
|
7012
|
-
/* @__PURE__ */
|
|
7324
|
+
!config && /* @__PURE__ */ jsx76("div", { className: "ss-g-body ss-g-loading", children: ui.games.loading }),
|
|
7325
|
+
config && /* @__PURE__ */ jsxs66(Fragment13, { children: [
|
|
7326
|
+
/* @__PURE__ */ jsxs66("div", { className: "ss-g-body", children: [
|
|
7327
|
+
/* @__PURE__ */ jsxs66("div", { className: "ss-g-hl-prompt", "data-testid": "hol-prompt", children: [
|
|
7328
|
+
/* @__PURE__ */ jsx76("span", { className: "ss-g-hl-prompt-q", children: t.whoHadMore }),
|
|
7329
|
+
/* @__PURE__ */ jsx76("span", { className: "ss-g-hl-prompt-stat", children: config.statLabel }),
|
|
7330
|
+
/* @__PURE__ */ jsx76("span", { className: "ss-g-hl-prompt-season", children: t.season(config.seasonLabel) })
|
|
7013
7331
|
] }),
|
|
7014
|
-
currentPair && /* @__PURE__ */
|
|
7015
|
-
/* @__PURE__ */
|
|
7016
|
-
/* @__PURE__ */
|
|
7017
|
-
/* @__PURE__ */
|
|
7332
|
+
currentPair && /* @__PURE__ */ jsxs66("div", { className: "ss-g-hl-pair", children: [
|
|
7333
|
+
/* @__PURE__ */ jsxs66(PlayerCard, { name: currentPair.playerAName, imagePath: currentPair.playerAImagePath, children: [
|
|
7334
|
+
/* @__PURE__ */ jsx76("span", { className: "ss-g-hl-value", children: currentPair.playerAValue }),
|
|
7335
|
+
/* @__PURE__ */ jsx76("span", { className: "ss-g-hl-stat", children: config.statLabel })
|
|
7018
7336
|
] }),
|
|
7019
|
-
/* @__PURE__ */
|
|
7020
|
-
/* @__PURE__ */
|
|
7021
|
-
/* @__PURE__ */
|
|
7022
|
-
/* @__PURE__ */
|
|
7337
|
+
/* @__PURE__ */ jsx76("span", { className: "ss-g-hl-vs", "aria-hidden": "true", children: t.vs }),
|
|
7338
|
+
/* @__PURE__ */ jsx76(PlayerCard, { name: currentPair.playerBName, imagePath: currentPair.playerBImagePath, highlight: true, children: /* @__PURE__ */ jsxs66("div", { className: "ss-g-hl-btns", children: [
|
|
7339
|
+
/* @__PURE__ */ jsxs66(GameButton, { variant: "primary", disabled: submitting, onClick: () => handlePick("higher"), children: [
|
|
7340
|
+
/* @__PURE__ */ jsx76(IconArrowUp, { size: 16 }),
|
|
7023
7341
|
t.higher
|
|
7024
7342
|
] }),
|
|
7025
|
-
/* @__PURE__ */
|
|
7026
|
-
/* @__PURE__ */
|
|
7343
|
+
/* @__PURE__ */ jsxs66(GameButton, { variant: "outline", disabled: submitting, onClick: () => handlePick("lower"), children: [
|
|
7344
|
+
/* @__PURE__ */ jsx76(IconArrowDown, { size: 16 }),
|
|
7027
7345
|
t.lower
|
|
7028
7346
|
] })
|
|
7029
7347
|
] }) })
|
|
7030
7348
|
] }),
|
|
7031
|
-
lastAnswer && lastAnswerPair && /* @__PURE__ */
|
|
7032
|
-
lastAnswer.wasCorrect ? /* @__PURE__ */
|
|
7349
|
+
lastAnswer && lastAnswerPair && /* @__PURE__ */ jsxs66("p", { className: "ss-g-hl-feedback", "data-testid": "hol-last", "data-correct": lastAnswer.wasCorrect ? "true" : "false", children: [
|
|
7350
|
+
lastAnswer.wasCorrect ? /* @__PURE__ */ jsx76(IconCheck, {}) : /* @__PURE__ */ jsx76(IconClose, {}),
|
|
7033
7351
|
t.lastAnswer(splitName(lastAnswerPair.playerBName).last, lastAnswer.playerBValue)
|
|
7034
7352
|
] }),
|
|
7035
|
-
isOver && /* @__PURE__ */
|
|
7353
|
+
isOver && /* @__PURE__ */ jsx76(
|
|
7036
7354
|
ResultCard,
|
|
7037
7355
|
{
|
|
7038
7356
|
tone: runEndedWrong ? "lose" : allPairsAnswered ? "win" : "neutral",
|
|
@@ -7044,15 +7362,15 @@ function HigherOrLowerGame({
|
|
|
7044
7362
|
}
|
|
7045
7363
|
)
|
|
7046
7364
|
] }),
|
|
7047
|
-
!isOver && /* @__PURE__ */
|
|
7048
|
-
/* @__PURE__ */
|
|
7365
|
+
!isOver && /* @__PURE__ */ jsx76(FooterBar, { children: /* @__PURE__ */ jsxs66("div", { className: "ss-g-hl-foot", children: [
|
|
7366
|
+
/* @__PURE__ */ jsx76("div", { className: "ss-g-hl-dots", role: "img", "aria-label": t.answersSoFar(answeredCount, config.pairs.length), children: config.pairs.map((p, i) => {
|
|
7049
7367
|
const a = answeredPairs[i];
|
|
7050
|
-
return /* @__PURE__ */
|
|
7368
|
+
return /* @__PURE__ */ jsx76("span", { className: "ss-g-hl-dot", "data-state": a ? a.wasCorrect ? "correct" : "wrong" : "todo" }, p.pairIndex);
|
|
7051
7369
|
}) }),
|
|
7052
|
-
/* @__PURE__ */
|
|
7053
|
-
/* @__PURE__ */
|
|
7370
|
+
/* @__PURE__ */ jsxs66("span", { className: "ss-g-hl-pts", children: [
|
|
7371
|
+
/* @__PURE__ */ jsx76("span", { "data-testid": "hol-score", children: score }),
|
|
7054
7372
|
" ",
|
|
7055
|
-
/* @__PURE__ */
|
|
7373
|
+
/* @__PURE__ */ jsx76("span", { className: "ss-g-hl-pts-unit", children: ui.games.unitPts })
|
|
7056
7374
|
] })
|
|
7057
7375
|
] }) })
|
|
7058
7376
|
] })
|
|
@@ -7060,21 +7378,21 @@ function HigherOrLowerGame({
|
|
|
7060
7378
|
}
|
|
7061
7379
|
|
|
7062
7380
|
// src/components/games/CareerPathGame.tsx
|
|
7063
|
-
import { useState as
|
|
7381
|
+
import { useState as useState35, useId as useId4 } from "react";
|
|
7064
7382
|
|
|
7065
7383
|
// src/components/games/ui/CrestShield.tsx
|
|
7066
|
-
import { useState as
|
|
7067
|
-
import { jsx as
|
|
7384
|
+
import { useState as useState34 } from "react";
|
|
7385
|
+
import { jsx as jsx77 } from "react/jsx-runtime";
|
|
7068
7386
|
function CrestShield({ src, name, size = 28 }) {
|
|
7069
|
-
const [failed, setFailed] =
|
|
7387
|
+
const [failed, setFailed] = useState34(false);
|
|
7070
7388
|
if (src && !isPlaceholderImage(src) && !failed) {
|
|
7071
|
-
return /* @__PURE__ */
|
|
7389
|
+
return /* @__PURE__ */ jsx77("img", { className: "ss-g-crest", src, alt: name, width: size, height: size, loading: "lazy", onError: () => setFailed(true) });
|
|
7072
7390
|
}
|
|
7073
|
-
return /* @__PURE__ */
|
|
7391
|
+
return /* @__PURE__ */ jsx77("svg", { className: "ss-g-crest ss-g-crest--ph", width: size, height: size * 32 / 28, viewBox: "0 0 28 32", role: "img", "aria-label": name, children: /* @__PURE__ */ jsx77("path", { d: "M2 3h24v12c0 9-6 14-12 17C8 29 2 24 2 15z", fill: "currentColor" }) });
|
|
7074
7392
|
}
|
|
7075
7393
|
|
|
7076
7394
|
// src/components/games/CareerPathGame.tsx
|
|
7077
|
-
import { Fragment as Fragment14, jsx as
|
|
7395
|
+
import { Fragment as Fragment14, jsx as jsx78, jsxs as jsxs67 } from "react/jsx-runtime";
|
|
7078
7396
|
function parseClientState3(json) {
|
|
7079
7397
|
if (!json) return null;
|
|
7080
7398
|
try {
|
|
@@ -7098,15 +7416,15 @@ function CareerPathGame({
|
|
|
7098
7416
|
}) {
|
|
7099
7417
|
const s = ui.games.careerPath;
|
|
7100
7418
|
const title = gameTitle({ gameId: "career-path" }, ui.games.titles);
|
|
7101
|
-
const [query, setQuery] =
|
|
7102
|
-
const inputId =
|
|
7419
|
+
const [query, setQuery] = useState35("");
|
|
7420
|
+
const inputId = useId4();
|
|
7103
7421
|
const clientState = parseClientState3(result?.clientStateJson);
|
|
7104
7422
|
const alreadyGuessedIds = new Set(clientState?.guessResults.map((g) => g.playerId) ?? []);
|
|
7105
7423
|
const isOver = result?.alreadyPlayed === true || clientState?.solved === true || clientState?.failed === true;
|
|
7106
7424
|
if (!config) {
|
|
7107
|
-
return /* @__PURE__ */
|
|
7108
|
-
/* @__PURE__ */
|
|
7109
|
-
/* @__PURE__ */
|
|
7425
|
+
return /* @__PURE__ */ jsxs67("div", { className: "ss-g-screen", "data-game": "career-path", "data-testid": "game-screen-career-path", children: [
|
|
7426
|
+
/* @__PURE__ */ jsx78(GameHeader, { title, eyebrow: s.eyebrow, onBack, backLabel: ui.back }),
|
|
7427
|
+
/* @__PURE__ */ jsx78("div", { className: "ss-g-body ss-g-loading", children: ui.games.loading })
|
|
7110
7428
|
] });
|
|
7111
7429
|
}
|
|
7112
7430
|
const visiblePath = clientState?.visiblePath ?? config.initialPath;
|
|
@@ -7120,61 +7438,61 @@ function CareerPathGame({
|
|
|
7120
7438
|
setQuery("");
|
|
7121
7439
|
onSubmit(JSON.stringify({ guesses: newGuesses }));
|
|
7122
7440
|
}
|
|
7123
|
-
const right = !isOver && clientState ? /* @__PURE__ */
|
|
7441
|
+
const right = !isOver && clientState ? /* @__PURE__ */ jsx78("span", { "data-testid": "cp-guess-chip", children: /* @__PURE__ */ jsxs67(Chip, { variant: "neutral", children: [
|
|
7124
7442
|
ui.games.guess,
|
|
7125
7443
|
" ",
|
|
7126
|
-
/* @__PURE__ */
|
|
7444
|
+
/* @__PURE__ */ jsx78("span", { className: "ss-g-num", children: clientState.guessesUsed + 1 }),
|
|
7127
7445
|
" / ",
|
|
7128
7446
|
clientState.guessesUsed + clientState.guessesRemaining
|
|
7129
7447
|
] }) }) : void 0;
|
|
7130
7448
|
const outcome = clientState?.solved ? s.solved : clientState?.failed ? s.failed : ui.games.done;
|
|
7131
|
-
return /* @__PURE__ */
|
|
7132
|
-
/* @__PURE__ */
|
|
7133
|
-
/* @__PURE__ */
|
|
7134
|
-
!isOver && /* @__PURE__ */
|
|
7135
|
-
/* @__PURE__ */
|
|
7136
|
-
isOver && clientState?.revealedPlayerName ? /* @__PURE__ */
|
|
7137
|
-
/* @__PURE__ */
|
|
7138
|
-
/* @__PURE__ */
|
|
7139
|
-
clientState?.hintLine ? /* @__PURE__ */
|
|
7140
|
-
/* @__PURE__ */
|
|
7141
|
-
/* @__PURE__ */
|
|
7449
|
+
return /* @__PURE__ */ jsxs67("div", { className: "ss-g-screen", "data-game": "career-path", "data-testid": "game-screen-career-path", children: [
|
|
7450
|
+
/* @__PURE__ */ jsx78(GameHeader, { title, eyebrow: s.eyebrow, right, onBack, backLabel: ui.back }),
|
|
7451
|
+
/* @__PURE__ */ jsxs67("div", { className: "ss-g-body", children: [
|
|
7452
|
+
!isOver && /* @__PURE__ */ jsx78(PointsLadderRow, { ladder: config.pointsLadder, guessesUsed: clientState?.guessesUsed ?? 0, ui }),
|
|
7453
|
+
/* @__PURE__ */ jsxs67("div", { className: "ss-g-cp-card", children: [
|
|
7454
|
+
isOver && clientState?.revealedPlayerName ? /* @__PURE__ */ jsx78(PlayerAvatar, { className: "ss-g-cp-photo", name: clientState.revealedPlayerName, imagePath: clientState.revealedPlayerImagePath }) : /* @__PURE__ */ jsx78(Silhouette, { size: 64, variant: isOver ? "default" : "mystery" }),
|
|
7455
|
+
/* @__PURE__ */ jsxs67("div", { className: "ss-g-cp-card-text", children: [
|
|
7456
|
+
/* @__PURE__ */ jsx78("span", { className: "ss-g-cp-card-title", children: isOver && clientState?.revealedPlayerName ? clientState.revealedPlayerName : s.mysteryPlayer }),
|
|
7457
|
+
clientState?.hintLine ? /* @__PURE__ */ jsx78("span", { className: "ss-g-cp-hint", children: clientState.hintLine }) : !isOver ? /* @__PURE__ */ jsxs67("span", { className: "ss-g-cp-locks", children: [
|
|
7458
|
+
/* @__PURE__ */ jsx78(Chip, { variant: "lock", icon: /* @__PURE__ */ jsx78(IconLock, { size: 11 }), children: s.lockPosition }),
|
|
7459
|
+
/* @__PURE__ */ jsx78(Chip, { variant: "lock", icon: /* @__PURE__ */ jsx78(IconLock, { size: 11 }), children: s.lockNationality })
|
|
7142
7460
|
] }) : null
|
|
7143
7461
|
] })
|
|
7144
7462
|
] }),
|
|
7145
|
-
/* @__PURE__ */
|
|
7463
|
+
/* @__PURE__ */ jsxs67("ol", { className: "ss-g-cp-line", children: [
|
|
7146
7464
|
visiblePath.map((spell, i) => {
|
|
7147
7465
|
const years = i === 0 ? s.firstClub : spellYears(spell);
|
|
7148
|
-
return /* @__PURE__ */
|
|
7149
|
-
/* @__PURE__ */
|
|
7150
|
-
/* @__PURE__ */
|
|
7151
|
-
/* @__PURE__ */
|
|
7466
|
+
return /* @__PURE__ */ jsxs67("li", { className: "ss-g-cp-step", children: [
|
|
7467
|
+
/* @__PURE__ */ jsxs67("span", { className: "ss-g-cp-rail", children: [
|
|
7468
|
+
/* @__PURE__ */ jsx78("span", { className: "ss-g-cp-tile", children: /* @__PURE__ */ jsx78(CrestShield, { src: spell.crestUrl, name: spell.clubName, size: 30 }) }),
|
|
7469
|
+
/* @__PURE__ */ jsx78("span", { className: "ss-g-cp-conn", "aria-hidden": "true" })
|
|
7152
7470
|
] }),
|
|
7153
|
-
/* @__PURE__ */
|
|
7154
|
-
/* @__PURE__ */
|
|
7155
|
-
/* @__PURE__ */
|
|
7156
|
-
/* @__PURE__ */
|
|
7157
|
-
spell.isLoan && /* @__PURE__ */
|
|
7471
|
+
/* @__PURE__ */ jsxs67("span", { className: "ss-g-cp-step-text", children: [
|
|
7472
|
+
/* @__PURE__ */ jsx78("span", { className: "ss-g-cp-club", children: spell.clubName }),
|
|
7473
|
+
/* @__PURE__ */ jsxs67("span", { className: "ss-g-cp-sub", children: [
|
|
7474
|
+
/* @__PURE__ */ jsx78("span", { className: "ss-g-cp-years", children: years }),
|
|
7475
|
+
spell.isLoan && /* @__PURE__ */ jsxs67(Fragment14, { children: [
|
|
7158
7476
|
years ? " \xB7 " : "",
|
|
7159
|
-
/* @__PURE__ */
|
|
7477
|
+
/* @__PURE__ */ jsx78("span", { className: "ss-g-cp-loan", children: s.loan })
|
|
7160
7478
|
] })
|
|
7161
7479
|
] })
|
|
7162
7480
|
] })
|
|
7163
7481
|
] }, `${spell.clubName}-${i}`);
|
|
7164
7482
|
}),
|
|
7165
|
-
hidden > 0 && /* @__PURE__ */
|
|
7166
|
-
/* @__PURE__ */
|
|
7167
|
-
/* @__PURE__ */
|
|
7168
|
-
hidden > 1 && /* @__PURE__ */
|
|
7483
|
+
hidden > 0 && /* @__PURE__ */ jsxs67("li", { className: "ss-g-cp-step ss-g-cp-step--hidden", children: [
|
|
7484
|
+
/* @__PURE__ */ jsxs67("span", { className: "ss-g-cp-rail", children: [
|
|
7485
|
+
/* @__PURE__ */ jsx78("span", { className: "ss-g-cp-tile ss-g-cp-tile--locked", children: /* @__PURE__ */ jsx78(IconLock, { size: 18 }) }),
|
|
7486
|
+
hidden > 1 && /* @__PURE__ */ jsx78("span", { className: "ss-g-cp-conn ss-g-cp-conn--faint", "aria-hidden": "true" })
|
|
7169
7487
|
] }),
|
|
7170
|
-
/* @__PURE__ */
|
|
7488
|
+
/* @__PURE__ */ jsx78("span", { className: "ss-g-cp-step-text", children: /* @__PURE__ */ jsx78("span", { className: "ss-g-cp-sub", children: s.nextClubHidden }) })
|
|
7171
7489
|
] }),
|
|
7172
|
-
hidden > 1 && /* @__PURE__ */
|
|
7173
|
-
/* @__PURE__ */
|
|
7174
|
-
/* @__PURE__ */
|
|
7490
|
+
hidden > 1 && /* @__PURE__ */ jsxs67("li", { className: "ss-g-cp-step ss-g-cp-step--more", children: [
|
|
7491
|
+
/* @__PURE__ */ jsx78("span", { className: "ss-g-cp-rail", children: /* @__PURE__ */ jsx78("span", { className: "ss-g-cp-tile ss-g-cp-tile--faint", children: /* @__PURE__ */ jsx78(IconLock, { size: 18 }) }) }),
|
|
7492
|
+
/* @__PURE__ */ jsx78("span", { className: "ss-g-cp-step-text", children: /* @__PURE__ */ jsx78("span", { className: "ss-g-cp-sub", children: s.moreClubs(hidden - 1) }) })
|
|
7175
7493
|
] })
|
|
7176
7494
|
] }),
|
|
7177
|
-
isOver && /* @__PURE__ */
|
|
7495
|
+
isOver && /* @__PURE__ */ jsx78(
|
|
7178
7496
|
ResultCard,
|
|
7179
7497
|
{
|
|
7180
7498
|
tone: clientState?.solved ? "win" : clientState?.failed ? "lose" : "neutral",
|
|
@@ -7186,7 +7504,7 @@ function CareerPathGame({
|
|
|
7186
7504
|
}
|
|
7187
7505
|
)
|
|
7188
7506
|
] }),
|
|
7189
|
-
!isOver && /* @__PURE__ */
|
|
7507
|
+
!isOver && /* @__PURE__ */ jsx78(FooterBar, { children: /* @__PURE__ */ jsx78(
|
|
7190
7508
|
AnswerTray,
|
|
7191
7509
|
{
|
|
7192
7510
|
id: inputId,
|
|
@@ -7205,16 +7523,16 @@ function CareerPathGame({
|
|
|
7205
7523
|
}
|
|
7206
7524
|
|
|
7207
7525
|
// src/components/games/BeatTheGridGame.tsx
|
|
7208
|
-
import React, { useEffect as
|
|
7526
|
+
import React, { useEffect as useEffect23, useId as useId5, useRef as useRef19, useState as useState36 } from "react";
|
|
7209
7527
|
|
|
7210
7528
|
// src/components/games/ui/OptionList.tsx
|
|
7211
|
-
import { jsx as
|
|
7529
|
+
import { jsx as jsx79 } from "react/jsx-runtime";
|
|
7212
7530
|
function OptionList({ label, options, onPick }) {
|
|
7213
|
-
return /* @__PURE__ */
|
|
7531
|
+
return /* @__PURE__ */ jsx79("div", { className: "ss-g-opts", role: "listbox", "aria-label": label, children: options.map((o) => /* @__PURE__ */ jsx79("button", { type: "button", role: "option", "aria-selected": false, className: "ss-g-opt", onClick: () => onPick(o.key), children: o.content }, o.key)) });
|
|
7214
7532
|
}
|
|
7215
7533
|
|
|
7216
7534
|
// src/components/games/BeatTheGridGame.tsx
|
|
7217
|
-
import { Fragment as Fragment15, jsx as
|
|
7535
|
+
import { Fragment as Fragment15, jsx as jsx80, jsxs as jsxs68 } from "react/jsx-runtime";
|
|
7218
7536
|
function criterionIconKind(label, key) {
|
|
7219
7537
|
const l = (key ?? label).toLowerCase();
|
|
7220
7538
|
if (l.includes("app")) return "calendar";
|
|
@@ -7232,34 +7550,34 @@ function rowAbbrev(label, map, key) {
|
|
|
7232
7550
|
function CriterionIcon({ kind }) {
|
|
7233
7551
|
switch (kind) {
|
|
7234
7552
|
case "calendar":
|
|
7235
|
-
return /* @__PURE__ */
|
|
7553
|
+
return /* @__PURE__ */ jsx80(IconCalendar, {});
|
|
7236
7554
|
case "ball":
|
|
7237
|
-
return /* @__PURE__ */
|
|
7555
|
+
return /* @__PURE__ */ jsx80(IconBall, {});
|
|
7238
7556
|
case "boot":
|
|
7239
|
-
return /* @__PURE__ */
|
|
7557
|
+
return /* @__PURE__ */ jsx80(IconBoot, {});
|
|
7240
7558
|
case "gloves":
|
|
7241
|
-
return /* @__PURE__ */
|
|
7559
|
+
return /* @__PURE__ */ jsx80(IconGloves, {});
|
|
7242
7560
|
case "shield":
|
|
7243
|
-
return /* @__PURE__ */
|
|
7561
|
+
return /* @__PURE__ */ jsx80(IconShield, {});
|
|
7244
7562
|
default:
|
|
7245
|
-
return /* @__PURE__ */
|
|
7563
|
+
return /* @__PURE__ */ jsx80(IconFlag, {});
|
|
7246
7564
|
}
|
|
7247
7565
|
}
|
|
7248
7566
|
function HeaderVisual({ label, textKey: iKey, meta }) {
|
|
7249
7567
|
if (!meta) {
|
|
7250
|
-
return /* @__PURE__ */
|
|
7568
|
+
return /* @__PURE__ */ jsx80(CriterionIcon, { kind: criterionIconKind(label, iKey) });
|
|
7251
7569
|
}
|
|
7252
7570
|
switch (meta.kind) {
|
|
7253
7571
|
case "club":
|
|
7254
|
-
return /* @__PURE__ */
|
|
7572
|
+
return /* @__PURE__ */ jsx80(CrestShield, { src: meta.imageUrl, name: label, size: 24 });
|
|
7255
7573
|
case "coach":
|
|
7256
|
-
return /* @__PURE__ */
|
|
7574
|
+
return /* @__PURE__ */ jsx80(PlayerAvatar, { name: label, imagePath: meta.imageUrl, className: "ss-g-btg-coach-av" });
|
|
7257
7575
|
case "country":
|
|
7258
|
-
return /* @__PURE__ */
|
|
7576
|
+
return /* @__PURE__ */ jsx80("span", { className: "ss-g-btg-hdr-flag", "aria-hidden": "true", children: nationalityFlag(meta.country ?? label) });
|
|
7259
7577
|
case "position":
|
|
7260
|
-
return /* @__PURE__ */
|
|
7578
|
+
return /* @__PURE__ */ jsx80(Fragment15, {});
|
|
7261
7579
|
default:
|
|
7262
|
-
return /* @__PURE__ */
|
|
7580
|
+
return /* @__PURE__ */ jsx80(CriterionIcon, { kind: criterionIconKind(label, iKey) });
|
|
7263
7581
|
}
|
|
7264
7582
|
}
|
|
7265
7583
|
function parseClientState4(json) {
|
|
@@ -7294,21 +7612,21 @@ function SearchSheet({
|
|
|
7294
7612
|
ui
|
|
7295
7613
|
}) {
|
|
7296
7614
|
const s = ui.games.beatTheGrid;
|
|
7297
|
-
const [query, setQuery] =
|
|
7298
|
-
const inputId =
|
|
7299
|
-
const inputRef =
|
|
7300
|
-
|
|
7615
|
+
const [query, setQuery] = useState36("");
|
|
7616
|
+
const inputId = useId5();
|
|
7617
|
+
const inputRef = useRef19(null);
|
|
7618
|
+
useEffect23(() => {
|
|
7301
7619
|
inputRef.current?.focus();
|
|
7302
7620
|
}, [row, col]);
|
|
7303
7621
|
const filtered = playerPool.filter(
|
|
7304
7622
|
(p) => !alreadyFilledIds.has(p.id) && p.name.toLowerCase().includes(query.toLowerCase())
|
|
7305
7623
|
);
|
|
7306
|
-
return /* @__PURE__ */
|
|
7307
|
-
/* @__PURE__ */
|
|
7308
|
-
/* @__PURE__ */
|
|
7309
|
-
/* @__PURE__ */
|
|
7310
|
-
/* @__PURE__ */
|
|
7311
|
-
/* @__PURE__ */
|
|
7624
|
+
return /* @__PURE__ */ jsxs68("div", { className: "ss-g-btg-sheet", "data-testid": "btg-search-sheet", children: [
|
|
7625
|
+
/* @__PURE__ */ jsxs68("div", { className: "ss-g-btg-sheet-hdr", children: [
|
|
7626
|
+
/* @__PURE__ */ jsx80(Chip, { variant: "neutral", children: rowLabel }),
|
|
7627
|
+
/* @__PURE__ */ jsx80("span", { className: "ss-g-btg-sheet-x", "aria-hidden": "true", children: /* @__PURE__ */ jsx80(IconClose, { size: 12 }) }),
|
|
7628
|
+
/* @__PURE__ */ jsx80(Chip, { variant: "accent", children: colLabel }),
|
|
7629
|
+
/* @__PURE__ */ jsx80(
|
|
7312
7630
|
"button",
|
|
7313
7631
|
{
|
|
7314
7632
|
type: "button",
|
|
@@ -7316,12 +7634,12 @@ function SearchSheet({
|
|
|
7316
7634
|
"data-testid": "btg-sheet-dismiss",
|
|
7317
7635
|
"aria-label": s.closeSearch,
|
|
7318
7636
|
onClick: onDismiss,
|
|
7319
|
-
children: /* @__PURE__ */
|
|
7637
|
+
children: /* @__PURE__ */ jsx80(IconClose, {})
|
|
7320
7638
|
}
|
|
7321
7639
|
)
|
|
7322
7640
|
] }),
|
|
7323
|
-
playerPool.length === 0 ? /* @__PURE__ */
|
|
7324
|
-
/* @__PURE__ */
|
|
7641
|
+
playerPool.length === 0 ? /* @__PURE__ */ jsx80("div", { className: "ss-g-btg-sheet-empty", children: s.emptyPool }) : /* @__PURE__ */ jsxs68(Fragment15, { children: [
|
|
7642
|
+
/* @__PURE__ */ jsx80(
|
|
7325
7643
|
SearchField,
|
|
7326
7644
|
{
|
|
7327
7645
|
id: inputId,
|
|
@@ -7333,16 +7651,16 @@ function SearchSheet({
|
|
|
7333
7651
|
inputRef
|
|
7334
7652
|
}
|
|
7335
7653
|
),
|
|
7336
|
-
query.length > 0 && filtered.length > 0 && /* @__PURE__ */
|
|
7654
|
+
query.length > 0 && filtered.length > 0 && /* @__PURE__ */ jsx80(
|
|
7337
7655
|
OptionList,
|
|
7338
7656
|
{
|
|
7339
7657
|
label: s.searchLabel(rowLabel, colLabel),
|
|
7340
7658
|
options: filtered.map((p) => ({
|
|
7341
7659
|
key: p.id,
|
|
7342
|
-
content: /* @__PURE__ */
|
|
7343
|
-
/* @__PURE__ */
|
|
7344
|
-
/* @__PURE__ */
|
|
7345
|
-
/* @__PURE__ */
|
|
7660
|
+
content: /* @__PURE__ */ jsxs68(Fragment15, { children: [
|
|
7661
|
+
/* @__PURE__ */ jsx80(PlayerAvatar, { name: p.name, imagePath: p.imagePath, className: "ss-g-opt-av" }),
|
|
7662
|
+
/* @__PURE__ */ jsx80("span", { className: "ss-g-btg-result-name", children: p.name }),
|
|
7663
|
+
/* @__PURE__ */ jsx80("span", { className: "ss-g-btg-result-plus", "aria-hidden": "true", children: /* @__PURE__ */ jsx80(IconPlus, { size: 18 }) })
|
|
7346
7664
|
] })
|
|
7347
7665
|
})),
|
|
7348
7666
|
onPick: (k) => onPick(row, col, Number(k))
|
|
@@ -7362,7 +7680,7 @@ function BeatTheGridGame({
|
|
|
7362
7680
|
}) {
|
|
7363
7681
|
const s = ui.games.beatTheGrid;
|
|
7364
7682
|
const title = gameTitle({ gameId: "beat-the-grid" }, ui.games.titles);
|
|
7365
|
-
const [activeCell, setActiveCell] =
|
|
7683
|
+
const [activeCell, setActiveCell] = useState36(null);
|
|
7366
7684
|
const clientState = parseClientState4(result?.clientStateJson);
|
|
7367
7685
|
const filledCells = clientState?.cells ?? [];
|
|
7368
7686
|
const isLocked2 = result?.alreadyPlayed === true || clientState?.isComplete === true;
|
|
@@ -7380,9 +7698,9 @@ function BeatTheGridGame({
|
|
|
7380
7698
|
onSubmit(JSON.stringify({ cells: newCells }));
|
|
7381
7699
|
}
|
|
7382
7700
|
if (!config) {
|
|
7383
|
-
return /* @__PURE__ */
|
|
7384
|
-
/* @__PURE__ */
|
|
7385
|
-
/* @__PURE__ */
|
|
7701
|
+
return /* @__PURE__ */ jsxs68("div", { className: "ss-g-screen", "data-game": "beat-the-grid", "data-testid": "game-screen-beat-the-grid", children: [
|
|
7702
|
+
/* @__PURE__ */ jsx80(GameHeader, { title, eyebrow: s.eyebrow, onBack, backLabel: ui.back }),
|
|
7703
|
+
/* @__PURE__ */ jsx80("div", { className: "ss-g-body ss-g-loading", children: ui.games.loading })
|
|
7386
7704
|
] });
|
|
7387
7705
|
}
|
|
7388
7706
|
const rows = config.rows;
|
|
@@ -7395,20 +7713,20 @@ function BeatTheGridGame({
|
|
|
7395
7713
|
(_, i) => i < correctCount ? "correct" : i < correctCount + wrongCount ? "wrong" : "todo"
|
|
7396
7714
|
);
|
|
7397
7715
|
const totalScore = clientState?.totalScore ?? result?.score ?? 0;
|
|
7398
|
-
return /* @__PURE__ */
|
|
7399
|
-
/* @__PURE__ */
|
|
7400
|
-
/* @__PURE__ */
|
|
7716
|
+
return /* @__PURE__ */ jsxs68("div", { className: "ss-g-screen", "data-game": "beat-the-grid", "data-testid": "game-screen-beat-the-grid", children: [
|
|
7717
|
+
/* @__PURE__ */ jsx80(GameHeader, { title, eyebrow: s.eyebrow, onBack, backLabel: ui.back }),
|
|
7718
|
+
/* @__PURE__ */ jsx80(
|
|
7401
7719
|
SegmentProgress,
|
|
7402
7720
|
{
|
|
7403
7721
|
segments,
|
|
7404
7722
|
ariaLabel: s.progressAria(filledCells.length, total),
|
|
7405
7723
|
leftLabel: s.filled(filledCells.length, total),
|
|
7406
7724
|
rightLabel: s.toGo(Math.max(0, total - filledCells.length)),
|
|
7407
|
-
right: /* @__PURE__ */
|
|
7725
|
+
right: /* @__PURE__ */ jsx80(Chip, { variant: "accent", children: `${totalScore} ${ui.games.unitPts}` })
|
|
7408
7726
|
}
|
|
7409
7727
|
),
|
|
7410
|
-
/* @__PURE__ */
|
|
7411
|
-
/* @__PURE__ */
|
|
7728
|
+
/* @__PURE__ */ jsxs68("div", { className: "ss-g-body", children: [
|
|
7729
|
+
/* @__PURE__ */ jsxs68(
|
|
7412
7730
|
"div",
|
|
7413
7731
|
{
|
|
7414
7732
|
className: activeCell !== null ? "ss-g-btg-grid ss-g-btg-grid--fit" : "ss-g-btg-grid",
|
|
@@ -7418,31 +7736,31 @@ function BeatTheGridGame({
|
|
|
7418
7736
|
},
|
|
7419
7737
|
role: "grid",
|
|
7420
7738
|
children: [
|
|
7421
|
-
/* @__PURE__ */
|
|
7739
|
+
/* @__PURE__ */ jsx80("div", { className: "ss-g-btg-corner" }),
|
|
7422
7740
|
cols.map((col, colIdx) => {
|
|
7423
7741
|
const colMeta = config.colsMeta?.[colIdx];
|
|
7424
|
-
return /* @__PURE__ */
|
|
7425
|
-
/* @__PURE__ */
|
|
7426
|
-
/* @__PURE__ */
|
|
7742
|
+
return /* @__PURE__ */ jsxs68("div", { className: "ss-g-btg-colhdr", "data-meta": colMeta ? "true" : void 0, children: [
|
|
7743
|
+
/* @__PURE__ */ jsx80(HeaderVisual, { label: col, textKey: config.colsI18n?.[colIdx]?.key, meta: colMeta }),
|
|
7744
|
+
/* @__PURE__ */ jsx80("span", { children: col })
|
|
7427
7745
|
] }, col);
|
|
7428
7746
|
}),
|
|
7429
7747
|
rows.map((rowLabel, rowIdx) => {
|
|
7430
7748
|
const rowMeta = config.rowsMeta?.[rowIdx];
|
|
7431
7749
|
const abbr = rowAbbrev(rowLabel, s.rowAbbrev, config.rowsI18n?.[rowIdx]?.key);
|
|
7432
|
-
const rowHeaderContent = rowMeta ? /* @__PURE__ */
|
|
7433
|
-
/* @__PURE__ */
|
|
7434
|
-
/* @__PURE__ */
|
|
7435
|
-
] }) : abbr === rowLabel ? /* @__PURE__ */
|
|
7436
|
-
/* @__PURE__ */
|
|
7437
|
-
/* @__PURE__ */
|
|
7750
|
+
const rowHeaderContent = rowMeta ? /* @__PURE__ */ jsxs68(Fragment15, { children: [
|
|
7751
|
+
/* @__PURE__ */ jsx80(HeaderVisual, { label: rowLabel, textKey: config.rowsI18n?.[rowIdx]?.key, meta: rowMeta }),
|
|
7752
|
+
/* @__PURE__ */ jsx80("span", { children: rowLabel })
|
|
7753
|
+
] }) : abbr === rowLabel ? /* @__PURE__ */ jsx80("span", { children: rowLabel }) : /* @__PURE__ */ jsxs68(Fragment15, { children: [
|
|
7754
|
+
/* @__PURE__ */ jsx80("span", { "aria-hidden": "true", children: abbr }),
|
|
7755
|
+
/* @__PURE__ */ jsx80("span", { className: "ss-g-sr", children: rowLabel })
|
|
7438
7756
|
] });
|
|
7439
|
-
return /* @__PURE__ */
|
|
7440
|
-
/* @__PURE__ */
|
|
7757
|
+
return /* @__PURE__ */ jsxs68(React.Fragment, { children: [
|
|
7758
|
+
/* @__PURE__ */ jsx80("div", { className: "ss-g-btg-rowhdr", "data-meta": rowMeta ? "true" : void 0, children: rowHeaderContent }),
|
|
7441
7759
|
cols.map((colLabel, colIdx) => {
|
|
7442
7760
|
const filled = findCellResult(filledCells, rowIdx, colIdx);
|
|
7443
7761
|
const isActive = activeCell?.row === rowIdx && activeCell?.col === colIdx;
|
|
7444
7762
|
const state = filled ? filled.isCorrect ? "correct" : "wrong" : isActive ? "active" : "empty";
|
|
7445
|
-
return /* @__PURE__ */
|
|
7763
|
+
return /* @__PURE__ */ jsx80(
|
|
7446
7764
|
"button",
|
|
7447
7765
|
{
|
|
7448
7766
|
type: "button",
|
|
@@ -7453,20 +7771,20 @@ function BeatTheGridGame({
|
|
|
7453
7771
|
className: "ss-g-btg-cell",
|
|
7454
7772
|
disabled: isLocked2 || submitting,
|
|
7455
7773
|
onClick: () => handleCellClick(rowIdx, colIdx),
|
|
7456
|
-
children: filled ? /* @__PURE__ */
|
|
7457
|
-
/* @__PURE__ */
|
|
7774
|
+
children: filled ? /* @__PURE__ */ jsxs68(Fragment15, { children: [
|
|
7775
|
+
/* @__PURE__ */ jsx80(
|
|
7458
7776
|
"span",
|
|
7459
7777
|
{
|
|
7460
7778
|
className: `ss-g-btg-badge ss-g-btg-badge--${filled.isCorrect ? "correct" : "wrong"}`,
|
|
7461
7779
|
role: "img",
|
|
7462
7780
|
"aria-label": filled.isCorrect ? s.correct : s.wrong,
|
|
7463
|
-
children: filled.isCorrect ? /* @__PURE__ */
|
|
7781
|
+
children: filled.isCorrect ? /* @__PURE__ */ jsx80(IconCheck, { size: 11 }) : /* @__PURE__ */ jsx80(IconClose, { size: 11 })
|
|
7464
7782
|
}
|
|
7465
7783
|
),
|
|
7466
|
-
/* @__PURE__ */
|
|
7784
|
+
/* @__PURE__ */ jsx80("span", { className: "ss-g-btg-rarity", children: filled.rarityScore }),
|
|
7467
7785
|
(() => {
|
|
7468
7786
|
const entry = playerPool.find((p) => p.id === filled.playerId);
|
|
7469
|
-
return /* @__PURE__ */
|
|
7787
|
+
return /* @__PURE__ */ jsx80(
|
|
7470
7788
|
PlayerAvatar,
|
|
7471
7789
|
{
|
|
7472
7790
|
name: entry?.name ?? "",
|
|
@@ -7475,8 +7793,8 @@ function BeatTheGridGame({
|
|
|
7475
7793
|
}
|
|
7476
7794
|
);
|
|
7477
7795
|
})(),
|
|
7478
|
-
/* @__PURE__ */
|
|
7479
|
-
] }) : /* @__PURE__ */
|
|
7796
|
+
/* @__PURE__ */ jsx80("span", { className: "ss-g-btg-name", children: shortName(playerPool.find((p) => p.id === filled.playerId)?.name) })
|
|
7797
|
+
] }) : /* @__PURE__ */ jsx80("span", { className: "ss-g-btg-plus", "aria-hidden": "true", children: /* @__PURE__ */ jsx80(IconPlus, { size: 22 }) })
|
|
7480
7798
|
},
|
|
7481
7799
|
`cell-${rowIdx}-${colIdx}`
|
|
7482
7800
|
);
|
|
@@ -7486,7 +7804,7 @@ function BeatTheGridGame({
|
|
|
7486
7804
|
]
|
|
7487
7805
|
}
|
|
7488
7806
|
),
|
|
7489
|
-
isLocked2 && /* @__PURE__ */
|
|
7807
|
+
isLocked2 && /* @__PURE__ */ jsx80(
|
|
7490
7808
|
ResultCard,
|
|
7491
7809
|
{
|
|
7492
7810
|
tone: "neutral",
|
|
@@ -7498,7 +7816,7 @@ function BeatTheGridGame({
|
|
|
7498
7816
|
}
|
|
7499
7817
|
)
|
|
7500
7818
|
] }),
|
|
7501
|
-
activeCell !== null && /* @__PURE__ */
|
|
7819
|
+
activeCell !== null && /* @__PURE__ */ jsx80("div", { className: "ss-g-btg-pin", children: /* @__PURE__ */ jsx80(
|
|
7502
7820
|
SearchSheet,
|
|
7503
7821
|
{
|
|
7504
7822
|
row: activeCell.row,
|
|
@@ -7517,21 +7835,21 @@ function BeatTheGridGame({
|
|
|
7517
7835
|
}
|
|
7518
7836
|
|
|
7519
7837
|
// src/components/games/GuessTheXiGame.tsx
|
|
7520
|
-
import { useState as
|
|
7838
|
+
import { useState as useState37, useId as useId6 } from "react";
|
|
7521
7839
|
|
|
7522
7840
|
// src/components/games/ui/PitchSvg.tsx
|
|
7523
|
-
import { Fragment as Fragment16, jsx as
|
|
7841
|
+
import { Fragment as Fragment16, jsx as jsx81, jsxs as jsxs69 } from "react/jsx-runtime";
|
|
7524
7842
|
function PitchSvg({ variant }) {
|
|
7525
|
-
return /* @__PURE__ */
|
|
7526
|
-
/* @__PURE__ */
|
|
7527
|
-
variant === "full" ? /* @__PURE__ */
|
|
7528
|
-
/* @__PURE__ */
|
|
7529
|
-
/* @__PURE__ */
|
|
7530
|
-
/* @__PURE__ */
|
|
7531
|
-
/* @__PURE__ */
|
|
7532
|
-
] }) : /* @__PURE__ */
|
|
7533
|
-
/* @__PURE__ */
|
|
7534
|
-
/* @__PURE__ */
|
|
7843
|
+
return /* @__PURE__ */ jsxs69("svg", { className: "ss-g-pitch-svg", viewBox: variant === "full" ? "0 0 100 150" : "0 0 100 100", preserveAspectRatio: "none", "aria-hidden": "true", children: [
|
|
7844
|
+
/* @__PURE__ */ jsx81("rect", { x: "4", y: "4", width: "92", height: variant === "full" ? 142 : 92, fill: "none" }),
|
|
7845
|
+
variant === "full" ? /* @__PURE__ */ jsxs69(Fragment16, { children: [
|
|
7846
|
+
/* @__PURE__ */ jsx81("line", { x1: "4", y1: "75", x2: "96", y2: "75" }),
|
|
7847
|
+
/* @__PURE__ */ jsx81("circle", { cx: "50", cy: "75", r: "12", fill: "none" }),
|
|
7848
|
+
/* @__PURE__ */ jsx81("rect", { x: "26", y: "4", width: "48", height: "20", fill: "none" }),
|
|
7849
|
+
/* @__PURE__ */ jsx81("rect", { x: "26", y: "126", width: "48", height: "20", fill: "none" })
|
|
7850
|
+
] }) : /* @__PURE__ */ jsxs69(Fragment16, { children: [
|
|
7851
|
+
/* @__PURE__ */ jsx81("path", { d: "M38 4a12 12 0 0 0 24 0", fill: "none" }),
|
|
7852
|
+
/* @__PURE__ */ jsx81("rect", { x: "26", y: "76", width: "48", height: "20", fill: "none" })
|
|
7535
7853
|
] })
|
|
7536
7854
|
] });
|
|
7537
7855
|
}
|
|
@@ -7587,7 +7905,7 @@ function positionsBySlot(formation, rowsAttackFirst) {
|
|
|
7587
7905
|
}
|
|
7588
7906
|
|
|
7589
7907
|
// src/components/games/GuessTheXiGame.tsx
|
|
7590
|
-
import { Fragment as Fragment17, jsx as
|
|
7908
|
+
import { Fragment as Fragment17, jsx as jsx82, jsxs as jsxs70 } from "react/jsx-runtime";
|
|
7591
7909
|
var MAX_GUESSES2 = 3;
|
|
7592
7910
|
function parseClientState5(json) {
|
|
7593
7911
|
if (!json) return null;
|
|
@@ -7606,8 +7924,8 @@ function GuessTheXiGame({
|
|
|
7606
7924
|
onBack
|
|
7607
7925
|
}) {
|
|
7608
7926
|
const t = ui.games.guessTheXi;
|
|
7609
|
-
const [query, setQuery] =
|
|
7610
|
-
const inputId =
|
|
7927
|
+
const [query, setQuery] = useState37("");
|
|
7928
|
+
const inputId = useId6();
|
|
7611
7929
|
const clientState = parseClientState5(result?.clientStateJson);
|
|
7612
7930
|
const isOver = result?.alreadyPlayed === true || clientState?.status === "solved" || clientState?.status === "failed";
|
|
7613
7931
|
const solved = clientState?.status === "solved";
|
|
@@ -7637,31 +7955,31 @@ function GuessTheXiGame({
|
|
|
7637
7955
|
const wrongGuesses = (clientState?.guessHistory ?? []).filter((g) => !g.wasCorrect);
|
|
7638
7956
|
const guessesLeft = Math.max(0, MAX_GUESSES2 - (clientState?.guessesUsed ?? 0));
|
|
7639
7957
|
const teamName = (id) => config?.teamPool.find((tm) => tm.teamId === id)?.teamName ?? `#${id}`;
|
|
7640
|
-
return /* @__PURE__ */
|
|
7641
|
-
/* @__PURE__ */
|
|
7958
|
+
return /* @__PURE__ */ jsxs70("div", { className: "ss-g-screen ss-g-gxi", "data-game": "guess-the-xi", "data-testid": "game-screen-guess-the-xi", children: [
|
|
7959
|
+
/* @__PURE__ */ jsx82(
|
|
7642
7960
|
GameHeader,
|
|
7643
7961
|
{
|
|
7644
7962
|
title: gameTitle({ gameId: "guess-the-xi" }, ui.games.titles),
|
|
7645
7963
|
eyebrow: config?.poolLabel,
|
|
7646
|
-
right: formation ? /* @__PURE__ */
|
|
7964
|
+
right: formation ? /* @__PURE__ */ jsx82(Chip, { variant: "accent", children: formation }) : void 0,
|
|
7647
7965
|
onBack,
|
|
7648
7966
|
backLabel: ui.back
|
|
7649
7967
|
}
|
|
7650
7968
|
),
|
|
7651
|
-
!config && /* @__PURE__ */
|
|
7652
|
-
config && /* @__PURE__ */
|
|
7653
|
-
/* @__PURE__ */
|
|
7654
|
-
!isOver && /* @__PURE__ */
|
|
7655
|
-
rows.length > 0 && /* @__PURE__ */
|
|
7656
|
-
/* @__PURE__ */
|
|
7657
|
-
/* @__PURE__ */
|
|
7969
|
+
!config && /* @__PURE__ */ jsx82("div", { className: "ss-g-body ss-g-loading", children: ui.games.loading }),
|
|
7970
|
+
config && /* @__PURE__ */ jsxs70(Fragment17, { children: [
|
|
7971
|
+
/* @__PURE__ */ jsxs70("div", { className: "ss-g-body", children: [
|
|
7972
|
+
!isOver && /* @__PURE__ */ jsx82(PointsLadderRow, { ladder: config.pointsLadder, guessesUsed: clientState?.guessHistory.length ?? 0, ui }),
|
|
7973
|
+
rows.length > 0 && /* @__PURE__ */ jsxs70("div", { className: "ss-g-gxi-pitch", role: "group", "aria-label": t.pitchLabel, children: [
|
|
7974
|
+
/* @__PURE__ */ jsx82(PitchSvg, { variant: "full" }),
|
|
7975
|
+
/* @__PURE__ */ jsx82("div", { className: "ss-g-gxi-rows", children: rows.map((row, r) => /* @__PURE__ */ jsx82("div", { className: "ss-g-gxi-row", children: row.map((pos, c) => {
|
|
7658
7976
|
const posLabel = pos.slot ? posBySlot.get(pos.slot) ?? "" : "";
|
|
7659
7977
|
const name = pos.slot ? nameBySlot.get(pos.slot) : void 0;
|
|
7660
7978
|
const lineupEntry = pos.slot ? lineupBySlot.get(pos.slot) : void 0;
|
|
7661
7979
|
const flag = nationalityFlag(pos.nationality);
|
|
7662
7980
|
if (lineupEntry) {
|
|
7663
|
-
return /* @__PURE__ */
|
|
7664
|
-
/* @__PURE__ */
|
|
7981
|
+
return /* @__PURE__ */ jsxs70("div", { className: "ss-g-gxi-node", "data-revealed": "true", children: [
|
|
7982
|
+
/* @__PURE__ */ jsx82(
|
|
7665
7983
|
PlayerAvatar,
|
|
7666
7984
|
{
|
|
7667
7985
|
name: lineupEntry.name,
|
|
@@ -7669,11 +7987,11 @@ function GuessTheXiGame({
|
|
|
7669
7987
|
className: "ss-g-gxi-disc ss-g-gxi-disc--photo"
|
|
7670
7988
|
}
|
|
7671
7989
|
),
|
|
7672
|
-
/* @__PURE__ */
|
|
7990
|
+
/* @__PURE__ */ jsx82("span", { className: "ss-g-gxi-pos ss-g-gxi-pos--name", children: splitName(lineupEntry.name).last })
|
|
7673
7991
|
] }, `${pos.slot}-${c}`);
|
|
7674
7992
|
}
|
|
7675
|
-
return /* @__PURE__ */
|
|
7676
|
-
/* @__PURE__ */
|
|
7993
|
+
return /* @__PURE__ */ jsxs70("div", { className: "ss-g-gxi-node", "data-revealed": name ? "true" : void 0, children: [
|
|
7994
|
+
/* @__PURE__ */ jsx82(
|
|
7677
7995
|
"span",
|
|
7678
7996
|
{
|
|
7679
7997
|
className: "ss-g-gxi-disc",
|
|
@@ -7684,22 +8002,22 @@ function GuessTheXiGame({
|
|
|
7684
8002
|
children: flag
|
|
7685
8003
|
}
|
|
7686
8004
|
),
|
|
7687
|
-
name ? /* @__PURE__ */
|
|
8005
|
+
name ? /* @__PURE__ */ jsx82("span", { className: "ss-g-gxi-pos ss-g-gxi-pos--name", children: splitName(name).last }) : posLabel && /* @__PURE__ */ jsx82("span", { className: "ss-g-gxi-pos", children: posLabel })
|
|
7688
8006
|
] }, `${pos.slot}-${c}`);
|
|
7689
8007
|
}) }, r)) })
|
|
7690
8008
|
] }),
|
|
7691
|
-
!isOver && wrongGuesses.length > 0 && /* @__PURE__ */
|
|
7692
|
-
/* @__PURE__ */
|
|
8009
|
+
!isOver && wrongGuesses.length > 0 && /* @__PURE__ */ jsxs70("div", { className: "ss-g-gxi-wrong", children: [
|
|
8010
|
+
/* @__PURE__ */ jsx82("span", { className: "ss-g-gxi-wrong-l", children: t.notThem }),
|
|
7693
8011
|
wrongGuesses.map((g) => {
|
|
7694
8012
|
const crestUrl = config?.teamPool.find((tm) => tm.teamId === g.teamId)?.crestUrl;
|
|
7695
|
-
return /* @__PURE__ */
|
|
7696
|
-
/* @__PURE__ */
|
|
7697
|
-
/* @__PURE__ */
|
|
8013
|
+
return /* @__PURE__ */ jsxs70("span", { className: "ss-g-gxi-wrong-chip", children: [
|
|
8014
|
+
/* @__PURE__ */ jsx82(CrestShield, { src: crestUrl, name: teamName(g.teamId), size: 18 }),
|
|
8015
|
+
/* @__PURE__ */ jsx82("s", { children: teamName(g.teamId) })
|
|
7698
8016
|
] }, g.teamId);
|
|
7699
8017
|
})
|
|
7700
8018
|
] }),
|
|
7701
|
-
isOver && /* @__PURE__ */
|
|
7702
|
-
/* @__PURE__ */
|
|
8019
|
+
isOver && /* @__PURE__ */ jsxs70(Fragment17, { children: [
|
|
8020
|
+
/* @__PURE__ */ jsx82(
|
|
7703
8021
|
ResultCard,
|
|
7704
8022
|
{
|
|
7705
8023
|
tone: solved ? "win" : failed ? "lose" : "neutral",
|
|
@@ -7710,29 +8028,29 @@ function GuessTheXiGame({
|
|
|
7710
8028
|
ui
|
|
7711
8029
|
}
|
|
7712
8030
|
),
|
|
7713
|
-
(solved || failed) && clientState?.answer && /* @__PURE__ */
|
|
7714
|
-
/* @__PURE__ */
|
|
7715
|
-
/* @__PURE__ */
|
|
7716
|
-
/* @__PURE__ */
|
|
8031
|
+
(solved || failed) && clientState?.answer && /* @__PURE__ */ jsxs70("div", { className: "ss-g-gxi-answer", "data-testid": "gxi-answer-reveal", children: [
|
|
8032
|
+
/* @__PURE__ */ jsx82("span", { className: "ss-g-gxi-answer-label", children: t.theAnswer }),
|
|
8033
|
+
/* @__PURE__ */ jsx82(CrestShield, { src: clientState.answer.crestUrl, name: clientState.answer.teamName, size: 32 }),
|
|
8034
|
+
/* @__PURE__ */ jsx82("span", { className: "ss-g-gxi-answer-name", children: clientState.answer.teamName })
|
|
7717
8035
|
] })
|
|
7718
8036
|
] })
|
|
7719
8037
|
] }),
|
|
7720
|
-
!isOver && /* @__PURE__ */
|
|
7721
|
-
query.length > 0 && filtered.length > 0 && /* @__PURE__ */
|
|
8038
|
+
!isOver && /* @__PURE__ */ jsxs70(FooterBar, { children: [
|
|
8039
|
+
query.length > 0 && filtered.length > 0 && /* @__PURE__ */ jsx82(
|
|
7722
8040
|
OptionList,
|
|
7723
8041
|
{
|
|
7724
8042
|
label: t.optionsLabel,
|
|
7725
8043
|
options: filtered.map((tm) => ({
|
|
7726
8044
|
key: tm.teamId,
|
|
7727
|
-
content: /* @__PURE__ */
|
|
7728
|
-
/* @__PURE__ */
|
|
7729
|
-
/* @__PURE__ */
|
|
8045
|
+
content: /* @__PURE__ */ jsxs70(Fragment17, { children: [
|
|
8046
|
+
/* @__PURE__ */ jsx82(CrestShield, { src: tm.crestUrl, name: tm.teamName, size: 28 }),
|
|
8047
|
+
/* @__PURE__ */ jsx82("span", { children: tm.teamName })
|
|
7730
8048
|
] })
|
|
7731
8049
|
})),
|
|
7732
8050
|
onPick: (k) => handlePick(Number(k))
|
|
7733
8051
|
}
|
|
7734
8052
|
),
|
|
7735
|
-
/* @__PURE__ */
|
|
8053
|
+
/* @__PURE__ */ jsx82(
|
|
7736
8054
|
SearchField,
|
|
7737
8055
|
{
|
|
7738
8056
|
id: inputId,
|
|
@@ -7749,8 +8067,8 @@ function GuessTheXiGame({
|
|
|
7749
8067
|
}
|
|
7750
8068
|
|
|
7751
8069
|
// src/components/games/DailyQuizGame.tsx
|
|
7752
|
-
import { useState as
|
|
7753
|
-
import { Fragment as Fragment18, jsx as
|
|
8070
|
+
import { useState as useState38 } from "react";
|
|
8071
|
+
import { Fragment as Fragment18, jsx as jsx83, jsxs as jsxs71 } from "react/jsx-runtime";
|
|
7754
8072
|
function parseClientState6(json) {
|
|
7755
8073
|
if (!json) return null;
|
|
7756
8074
|
try {
|
|
@@ -7771,13 +8089,13 @@ function OptionName({ text }) {
|
|
|
7771
8089
|
const tokens = base.split(/\s+/).filter(Boolean);
|
|
7772
8090
|
const isPlainName = tokens.length >= 1 && tokens.length <= 4 && tokens.every((t) => NAME_TOKEN.test(t));
|
|
7773
8091
|
if (!isPlainName || base === "") {
|
|
7774
|
-
return /* @__PURE__ */
|
|
8092
|
+
return /* @__PURE__ */ jsx83("span", { className: "ss-g-dq-opt-name", children: /* @__PURE__ */ jsx83("span", { className: "ss-g-dq-opt-full", children: text }) });
|
|
7775
8093
|
}
|
|
7776
8094
|
const { first, last } = splitName(base);
|
|
7777
|
-
return /* @__PURE__ */
|
|
7778
|
-
first && /* @__PURE__ */
|
|
7779
|
-
/* @__PURE__ */
|
|
7780
|
-
suffix && /* @__PURE__ */
|
|
8095
|
+
return /* @__PURE__ */ jsxs71("span", { className: "ss-g-dq-opt-name", children: [
|
|
8096
|
+
first && /* @__PURE__ */ jsx83("span", { className: "ss-g-dq-opt-first", children: first }),
|
|
8097
|
+
/* @__PURE__ */ jsx83("span", { className: "ss-g-dq-opt-last", children: last }),
|
|
8098
|
+
suffix && /* @__PURE__ */ jsx83("span", { className: "ss-g-dq-opt-suffix", children: suffix })
|
|
7781
8099
|
] });
|
|
7782
8100
|
}
|
|
7783
8101
|
function DailyQuizGame({
|
|
@@ -7790,15 +8108,15 @@ function DailyQuizGame({
|
|
|
7790
8108
|
}) {
|
|
7791
8109
|
const s = ui.games.dailyQuiz;
|
|
7792
8110
|
const title = gameTitle({ gameId: "daily-quiz" }, ui.games.titles);
|
|
7793
|
-
const [selections, setSelections] =
|
|
7794
|
-
const [page, setPage] =
|
|
8111
|
+
const [selections, setSelections] = useState38(/* @__PURE__ */ new Map());
|
|
8112
|
+
const [page, setPage] = useState38(0);
|
|
7795
8113
|
const clientState = parseClientState6(result?.clientStateJson);
|
|
7796
8114
|
const results = clientState?.results ?? [];
|
|
7797
8115
|
const isRevealed = results.length > 0 || result?.alreadyPlayed === true;
|
|
7798
8116
|
if (!config) {
|
|
7799
|
-
return /* @__PURE__ */
|
|
7800
|
-
/* @__PURE__ */
|
|
7801
|
-
/* @__PURE__ */
|
|
8117
|
+
return /* @__PURE__ */ jsxs71("div", { className: "ss-g-screen", "data-game": "daily-quiz", "data-testid": "game-screen-daily-quiz", children: [
|
|
8118
|
+
/* @__PURE__ */ jsx83(GameHeader, { title, onBack, backLabel: ui.back }),
|
|
8119
|
+
/* @__PURE__ */ jsx83("div", { className: "ss-g-body ss-g-loading", children: ui.games.loading })
|
|
7802
8120
|
] });
|
|
7803
8121
|
}
|
|
7804
8122
|
const questions = config.questions;
|
|
@@ -7833,11 +8151,11 @@ function DailyQuizGame({
|
|
|
7833
8151
|
return r.isCorrect ? "correct" : "wrong";
|
|
7834
8152
|
});
|
|
7835
8153
|
const correctCount = results.filter((r) => r.isCorrect).length;
|
|
7836
|
-
return /* @__PURE__ */
|
|
7837
|
-
/* @__PURE__ */
|
|
7838
|
-
/* @__PURE__ */
|
|
7839
|
-
/* @__PURE__ */
|
|
7840
|
-
/* @__PURE__ */
|
|
8154
|
+
return /* @__PURE__ */ jsxs71("div", { className: "ss-g-screen", "data-game": "daily-quiz", "data-testid": "game-screen-daily-quiz", children: [
|
|
8155
|
+
/* @__PURE__ */ jsx83(GameHeader, { title, eyebrow: s.results, onBack, backLabel: ui.back }),
|
|
8156
|
+
/* @__PURE__ */ jsx83(SegmentProgress, { segments: segments2, ariaLabel: s.results }),
|
|
8157
|
+
/* @__PURE__ */ jsxs71("div", { className: "ss-g-body", children: [
|
|
8158
|
+
/* @__PURE__ */ jsx83(
|
|
7841
8159
|
ResultCard,
|
|
7842
8160
|
{
|
|
7843
8161
|
tone: "neutral",
|
|
@@ -7850,15 +8168,15 @@ function DailyQuizGame({
|
|
|
7850
8168
|
questions.map((q) => {
|
|
7851
8169
|
const r = findResult(results, q.index);
|
|
7852
8170
|
const picked = selections.get(q.index);
|
|
7853
|
-
return /* @__PURE__ */
|
|
7854
|
-
/* @__PURE__ */
|
|
7855
|
-
r && /* @__PURE__ */
|
|
8171
|
+
return /* @__PURE__ */ jsxs71("div", { className: "ss-g-dq-rq", children: [
|
|
8172
|
+
/* @__PURE__ */ jsx83("div", { className: "ss-g-dq-rq-stem", children: q.stem }),
|
|
8173
|
+
r && /* @__PURE__ */ jsx83("div", { className: "ss-g-dq-rq-opts", children: q.options.map((opt, optIdx) => {
|
|
7856
8174
|
let cls = "ss-g-dq-rq-opt";
|
|
7857
8175
|
if (optIdx === r.correctOptionIndex) cls += " ss-g-dq-rq-opt--correct";
|
|
7858
8176
|
else if (optIdx === picked && !r.isCorrect) cls += " ss-g-dq-rq-opt--wrong";
|
|
7859
|
-
return /* @__PURE__ */
|
|
8177
|
+
return /* @__PURE__ */ jsx83("span", { className: cls, children: opt }, optIdx);
|
|
7860
8178
|
}) }),
|
|
7861
|
-
r?.revealText && /* @__PURE__ */
|
|
8179
|
+
r?.revealText && /* @__PURE__ */ jsx83("div", { className: "ss-g-dq-why", children: r.revealText })
|
|
7862
8180
|
] }, q.index);
|
|
7863
8181
|
})
|
|
7864
8182
|
] })
|
|
@@ -7866,16 +8184,16 @@ function DailyQuizGame({
|
|
|
7866
8184
|
}
|
|
7867
8185
|
const segments = questions.map((_, i) => i < page ? "done" : i === page ? "current" : "todo");
|
|
7868
8186
|
const selectedIdx = current ? selections.get(current.index) : void 0;
|
|
7869
|
-
return /* @__PURE__ */
|
|
7870
|
-
/* @__PURE__ */
|
|
7871
|
-
/* @__PURE__ */
|
|
7872
|
-
/* @__PURE__ */
|
|
7873
|
-
/* @__PURE__ */
|
|
7874
|
-
/* @__PURE__ */
|
|
8187
|
+
return /* @__PURE__ */ jsxs71("div", { className: "ss-g-screen", "data-game": "daily-quiz", "data-testid": "game-screen-daily-quiz", children: [
|
|
8188
|
+
/* @__PURE__ */ jsx83(GameHeader, { title, eyebrow: s.questionOf(page + 1, total), onBack, backLabel: ui.back }),
|
|
8189
|
+
/* @__PURE__ */ jsx83(SegmentProgress, { segments, ariaLabel: s.progressAria(page + 1, total) }),
|
|
8190
|
+
/* @__PURE__ */ jsx83("div", { className: "ss-g-body", children: current && /* @__PURE__ */ jsxs71(Fragment18, { children: [
|
|
8191
|
+
/* @__PURE__ */ jsx83("h3", { className: "ss-g-dq-stem", children: current.stem }),
|
|
8192
|
+
/* @__PURE__ */ jsx83("div", { className: "ss-g-dq-opts", children: current.options.map((opt, optIdx) => {
|
|
7875
8193
|
const selected = optIdx === selectedIdx;
|
|
7876
8194
|
const imagePath = current.optionImagePaths?.[optIdx] ?? void 0;
|
|
7877
8195
|
const playerName = opt;
|
|
7878
|
-
return /* @__PURE__ */
|
|
8196
|
+
return /* @__PURE__ */ jsxs71(
|
|
7879
8197
|
"button",
|
|
7880
8198
|
{
|
|
7881
8199
|
type: "button",
|
|
@@ -7884,25 +8202,25 @@ function DailyQuizGame({
|
|
|
7884
8202
|
disabled: submitting,
|
|
7885
8203
|
onClick: () => handleSelect(current.index, optIdx),
|
|
7886
8204
|
children: [
|
|
7887
|
-
current.optionImagePaths && /* @__PURE__ */
|
|
7888
|
-
/* @__PURE__ */
|
|
7889
|
-
/* @__PURE__ */
|
|
8205
|
+
current.optionImagePaths && /* @__PURE__ */ jsx83(PlayerAvatar, { name: playerName, imagePath, className: "ss-g-dq-opt-av" }),
|
|
8206
|
+
/* @__PURE__ */ jsx83("span", { className: "ss-g-dq-badge", "aria-hidden": "true", children: selected ? /* @__PURE__ */ jsx83(IconCheck, {}) : String.fromCharCode(65 + optIdx) }),
|
|
8207
|
+
/* @__PURE__ */ jsx83(OptionName, { text: opt })
|
|
7890
8208
|
]
|
|
7891
8209
|
},
|
|
7892
8210
|
optIdx
|
|
7893
8211
|
);
|
|
7894
8212
|
}) })
|
|
7895
8213
|
] }) }),
|
|
7896
|
-
/* @__PURE__ */
|
|
7897
|
-
page > 0 && /* @__PURE__ */
|
|
7898
|
-
isLast ? /* @__PURE__ */
|
|
8214
|
+
/* @__PURE__ */ jsx83(FooterBar, { children: /* @__PURE__ */ jsxs71("div", { className: "ss-g-dq-nav", children: [
|
|
8215
|
+
page > 0 && /* @__PURE__ */ jsx83(GameButton, { variant: "outline", onClick: goPrev, disabled: submitting, children: s.previous }),
|
|
8216
|
+
isLast ? /* @__PURE__ */ jsx83(GameButton, { variant: "primary", block: true, onClick: handleSubmit, disabled: !currentAnswered || !allAnswered || submitting, children: submitting ? s.submitting : s.submit }) : /* @__PURE__ */ jsx83(GameButton, { variant: "primary", block: true, onClick: goNext, disabled: !currentAnswered || submitting, children: s.next })
|
|
7899
8217
|
] }) })
|
|
7900
8218
|
] });
|
|
7901
8219
|
}
|
|
7902
8220
|
|
|
7903
8221
|
// src/components/games/MatchdayPredictorGame.tsx
|
|
7904
|
-
import { useId as
|
|
7905
|
-
import { jsx as
|
|
8222
|
+
import { useId as useId7, useState as useState39 } from "react";
|
|
8223
|
+
import { jsx as jsx84, jsxs as jsxs72 } from "react/jsx-runtime";
|
|
7906
8224
|
var SCORER_SEARCH_THRESHOLD = 9;
|
|
7907
8225
|
function parseClientState7(json) {
|
|
7908
8226
|
if (!json) return null;
|
|
@@ -7920,7 +8238,7 @@ function isLocked(kickoffUtc) {
|
|
|
7920
8238
|
}
|
|
7921
8239
|
}
|
|
7922
8240
|
function IconMinus() {
|
|
7923
|
-
return /* @__PURE__ */
|
|
8241
|
+
return /* @__PURE__ */ jsx84(
|
|
7924
8242
|
"svg",
|
|
7925
8243
|
{
|
|
7926
8244
|
width: 18,
|
|
@@ -7931,20 +8249,20 @@ function IconMinus() {
|
|
|
7931
8249
|
strokeWidth: 2.2,
|
|
7932
8250
|
strokeLinecap: "round",
|
|
7933
8251
|
"aria-hidden": "true",
|
|
7934
|
-
children: /* @__PURE__ */
|
|
8252
|
+
children: /* @__PURE__ */ jsx84("path", { d: "M5 12h14" })
|
|
7935
8253
|
}
|
|
7936
8254
|
);
|
|
7937
8255
|
}
|
|
7938
8256
|
function TeamBadge({ team, label }) {
|
|
7939
|
-
return /* @__PURE__ */
|
|
7940
|
-
/* @__PURE__ */
|
|
7941
|
-
/* @__PURE__ */
|
|
7942
|
-
/* @__PURE__ */
|
|
8257
|
+
return /* @__PURE__ */ jsxs72("div", { className: "ss-g-mp-team", children: [
|
|
8258
|
+
/* @__PURE__ */ jsx84(CrestShield, { name: team.name, size: 44 }),
|
|
8259
|
+
/* @__PURE__ */ jsx84("span", { className: "ss-g-mp-team-name", children: team.name }),
|
|
8260
|
+
/* @__PURE__ */ jsx84("span", { className: "ss-g-mp-team-side", children: label })
|
|
7943
8261
|
] });
|
|
7944
8262
|
}
|
|
7945
8263
|
function ScoreCard({ home, away, h, a, t, edit }) {
|
|
7946
|
-
const col = (side, team, value) => /* @__PURE__ */
|
|
7947
|
-
edit && /* @__PURE__ */
|
|
8264
|
+
const col = (side, team, value) => /* @__PURE__ */ jsxs72("div", { className: "ss-g-mp-col", children: [
|
|
8265
|
+
edit && /* @__PURE__ */ jsx84(
|
|
7948
8266
|
"button",
|
|
7949
8267
|
{
|
|
7950
8268
|
type: "button",
|
|
@@ -7952,11 +8270,11 @@ function ScoreCard({ home, away, h, a, t, edit }) {
|
|
|
7952
8270
|
"aria-label": t.goalsUp(team.name),
|
|
7953
8271
|
disabled: edit.disabled,
|
|
7954
8272
|
onClick: () => edit.onStep(side, 1),
|
|
7955
|
-
children: /* @__PURE__ */
|
|
8273
|
+
children: /* @__PURE__ */ jsx84(IconPlus, { size: 18 })
|
|
7956
8274
|
}
|
|
7957
8275
|
),
|
|
7958
|
-
/* @__PURE__ */
|
|
7959
|
-
edit && /* @__PURE__ */
|
|
8276
|
+
/* @__PURE__ */ jsx84("span", { className: "ss-g-mp-digit", "data-testid": "mp-digit", "data-active": edit ? String(edit.active === side) : "false", children: value }),
|
|
8277
|
+
edit && /* @__PURE__ */ jsx84(
|
|
7960
8278
|
"button",
|
|
7961
8279
|
{
|
|
7962
8280
|
type: "button",
|
|
@@ -7964,27 +8282,27 @@ function ScoreCard({ home, away, h, a, t, edit }) {
|
|
|
7964
8282
|
"aria-label": t.goalsDown(team.name),
|
|
7965
8283
|
disabled: edit.disabled || value <= 0,
|
|
7966
8284
|
onClick: () => edit.onStep(side, -1),
|
|
7967
|
-
children: /* @__PURE__ */
|
|
8285
|
+
children: /* @__PURE__ */ jsx84(IconMinus, {})
|
|
7968
8286
|
}
|
|
7969
8287
|
)
|
|
7970
8288
|
] });
|
|
7971
|
-
return /* @__PURE__ */
|
|
7972
|
-
/* @__PURE__ */
|
|
7973
|
-
/* @__PURE__ */
|
|
8289
|
+
return /* @__PURE__ */ jsxs72("div", { className: "ss-g-mp-card", children: [
|
|
8290
|
+
/* @__PURE__ */ jsx84(TeamBadge, { team: home, label: t.home }),
|
|
8291
|
+
/* @__PURE__ */ jsxs72("div", { className: "ss-g-mp-scores", children: [
|
|
7974
8292
|
col("home", home, h),
|
|
7975
|
-
/* @__PURE__ */
|
|
8293
|
+
/* @__PURE__ */ jsx84("span", { className: "ss-g-mp-dash", "aria-hidden": "true", children: "\u2013" }),
|
|
7976
8294
|
col("away", away, a)
|
|
7977
8295
|
] }),
|
|
7978
|
-
/* @__PURE__ */
|
|
8296
|
+
/* @__PURE__ */ jsx84(TeamBadge, { team: away, label: t.away })
|
|
7979
8297
|
] });
|
|
7980
8298
|
}
|
|
7981
8299
|
function OutcomeRow({ label, ok, detail, t }) {
|
|
7982
|
-
return /* @__PURE__ */
|
|
7983
|
-
/* @__PURE__ */
|
|
7984
|
-
/* @__PURE__ */
|
|
7985
|
-
ok ? /* @__PURE__ */
|
|
7986
|
-
/* @__PURE__ */
|
|
7987
|
-
detail ? /* @__PURE__ */
|
|
8300
|
+
return /* @__PURE__ */ jsxs72("li", { className: "ss-g-mp-row", "data-testid": "mp-row", "data-ok": String(ok), children: [
|
|
8301
|
+
/* @__PURE__ */ jsx84("span", { className: "ss-g-mp-row-k", children: label }),
|
|
8302
|
+
/* @__PURE__ */ jsxs72("span", { className: "ss-g-mp-row-v", children: [
|
|
8303
|
+
ok ? /* @__PURE__ */ jsx84(IconCheck, {}) : /* @__PURE__ */ jsx84(IconClose, { size: 14 }),
|
|
8304
|
+
/* @__PURE__ */ jsx84("span", { className: "ss-g-sr", children: ok ? t.correct : t.incorrect }),
|
|
8305
|
+
detail ? /* @__PURE__ */ jsx84("span", { className: "ss-g-mp-row-d", children: detail }) : null
|
|
7988
8306
|
] })
|
|
7989
8307
|
] });
|
|
7990
8308
|
}
|
|
@@ -7997,20 +8315,20 @@ function MatchdayPredictorGame({
|
|
|
7997
8315
|
onBack
|
|
7998
8316
|
}) {
|
|
7999
8317
|
const t = ui.games.predictor;
|
|
8000
|
-
const [homeScore, setHomeScore] =
|
|
8001
|
-
const [awayScore, setAwayScore] =
|
|
8002
|
-
const [firstScorerPlayerId, setFirstScorerPlayerId] =
|
|
8003
|
-
const [lastEdited, setLastEdited] =
|
|
8004
|
-
const [query, setQuery] =
|
|
8005
|
-
const searchId =
|
|
8318
|
+
const [homeScore, setHomeScore] = useState39(0);
|
|
8319
|
+
const [awayScore, setAwayScore] = useState39(0);
|
|
8320
|
+
const [firstScorerPlayerId, setFirstScorerPlayerId] = useState39(null);
|
|
8321
|
+
const [lastEdited, setLastEdited] = useState39("home");
|
|
8322
|
+
const [query, setQuery] = useState39("");
|
|
8323
|
+
const searchId = useId7();
|
|
8006
8324
|
const clientState = parseClientState7(result?.clientStateJson);
|
|
8007
8325
|
const alreadyPlayed = result?.alreadyPlayed === true;
|
|
8008
|
-
const header = /* @__PURE__ */
|
|
8326
|
+
const header = /* @__PURE__ */ jsx84(
|
|
8009
8327
|
GameHeader,
|
|
8010
8328
|
{
|
|
8011
8329
|
title: gameTitle({ gameId: "matchday-predictor" }, ui.games.titles),
|
|
8012
8330
|
eyebrow: config ? t.eyebrow(config.homeTeam.name, config.awayTeam.name) : void 0,
|
|
8013
|
-
right: config ? /* @__PURE__ */
|
|
8331
|
+
right: config ? /* @__PURE__ */ jsx84(Chip, { icon: /* @__PURE__ */ jsx84(IconLock, {}), children: ui.games.formatDayTime(config.kickoffUtc) }) : void 0,
|
|
8014
8332
|
onBack,
|
|
8015
8333
|
backLabel: ui.back
|
|
8016
8334
|
}
|
|
@@ -8018,10 +8336,10 @@ function MatchdayPredictorGame({
|
|
|
8018
8336
|
if (alreadyPlayed && clientState) {
|
|
8019
8337
|
if (!clientState.graded) {
|
|
8020
8338
|
const scorer = config?.scorerPool.find((p) => p.playerId === clientState.predictedFirstScorerPlayerId) ?? null;
|
|
8021
|
-
return /* @__PURE__ */
|
|
8339
|
+
return /* @__PURE__ */ jsxs72("div", { className: "ss-g-screen", "data-game": "matchday-predictor", "data-testid": "game-screen-matchday-predictor", children: [
|
|
8022
8340
|
header,
|
|
8023
|
-
/* @__PURE__ */
|
|
8024
|
-
config && /* @__PURE__ */
|
|
8341
|
+
/* @__PURE__ */ jsxs72("div", { className: "ss-g-body", children: [
|
|
8342
|
+
config && /* @__PURE__ */ jsx84(
|
|
8025
8343
|
ScoreCard,
|
|
8026
8344
|
{
|
|
8027
8345
|
home: config.homeTeam,
|
|
@@ -8031,7 +8349,7 @@ function MatchdayPredictorGame({
|
|
|
8031
8349
|
t
|
|
8032
8350
|
}
|
|
8033
8351
|
),
|
|
8034
|
-
/* @__PURE__ */
|
|
8352
|
+
/* @__PURE__ */ jsx84(
|
|
8035
8353
|
ResultCard,
|
|
8036
8354
|
{
|
|
8037
8355
|
tone: "neutral",
|
|
@@ -8048,28 +8366,28 @@ function MatchdayPredictorGame({
|
|
|
8048
8366
|
}
|
|
8049
8367
|
)
|
|
8050
8368
|
] }),
|
|
8051
|
-
/* @__PURE__ */
|
|
8369
|
+
/* @__PURE__ */ jsx84(FooterBar, { children: /* @__PURE__ */ jsx84("p", { className: "ss-g-mp-fun", children: t.forFun }) })
|
|
8052
8370
|
] });
|
|
8053
8371
|
}
|
|
8054
8372
|
const r = clientState.result;
|
|
8055
|
-
return /* @__PURE__ */
|
|
8373
|
+
return /* @__PURE__ */ jsxs72("div", { className: "ss-g-screen", "data-game": "matchday-predictor", "data-testid": "game-screen-matchday-predictor", children: [
|
|
8056
8374
|
header,
|
|
8057
|
-
/* @__PURE__ */
|
|
8058
|
-
config && /* @__PURE__ */
|
|
8059
|
-
/* @__PURE__ */
|
|
8060
|
-
/* @__PURE__ */
|
|
8061
|
-
/* @__PURE__ */
|
|
8062
|
-
/* @__PURE__ */
|
|
8063
|
-
!clientState.firstScorerVoid && /* @__PURE__ */
|
|
8375
|
+
/* @__PURE__ */ jsxs72("div", { className: "ss-g-body", children: [
|
|
8376
|
+
config && /* @__PURE__ */ jsx84(ScoreCard, { home: config.homeTeam, away: config.awayTeam, h: r.homeScore, a: r.awayScore, t }),
|
|
8377
|
+
/* @__PURE__ */ jsx84(ResultCard, { tone: "neutral", title: t.fullTime(r.homeScore, r.awayScore), onBack, ui }),
|
|
8378
|
+
/* @__PURE__ */ jsxs72("ul", { className: "ss-g-mp-rows", children: [
|
|
8379
|
+
/* @__PURE__ */ jsx84(OutcomeRow, { label: t.exactScore, ok: clientState.exactScoreCorrect, t }),
|
|
8380
|
+
/* @__PURE__ */ jsx84(OutcomeRow, { label: t.outcome, ok: clientState.outcomeCorrect, t }),
|
|
8381
|
+
!clientState.firstScorerVoid && /* @__PURE__ */ jsx84(OutcomeRow, { label: t.firstScorerRow, ok: clientState.firstScorerCorrect, detail: r.firstScorerName, t })
|
|
8064
8382
|
] })
|
|
8065
8383
|
] }),
|
|
8066
|
-
/* @__PURE__ */
|
|
8384
|
+
/* @__PURE__ */ jsx84(FooterBar, { children: /* @__PURE__ */ jsx84("p", { className: "ss-g-mp-fun", children: t.forFun }) })
|
|
8067
8385
|
] });
|
|
8068
8386
|
}
|
|
8069
8387
|
if (!config) {
|
|
8070
|
-
return /* @__PURE__ */
|
|
8388
|
+
return /* @__PURE__ */ jsxs72("div", { className: "ss-g-screen", "data-game": "matchday-predictor", "data-testid": "game-screen-matchday-predictor", children: [
|
|
8071
8389
|
header,
|
|
8072
|
-
/* @__PURE__ */
|
|
8390
|
+
/* @__PURE__ */ jsx84("div", { className: "ss-g-body ss-g-loading", children: ui.games.loading })
|
|
8073
8391
|
] });
|
|
8074
8392
|
}
|
|
8075
8393
|
const locked = isLocked(config.kickoffUtc);
|
|
@@ -8093,10 +8411,10 @@ function MatchdayPredictorGame({
|
|
|
8093
8411
|
const showSearch = pool.length > SCORER_SEARCH_THRESHOLD;
|
|
8094
8412
|
const q = query.trim().toLowerCase();
|
|
8095
8413
|
const visible = showSearch && q ? pool.filter((p) => p.playerName.toLowerCase().includes(q)) : pool;
|
|
8096
|
-
return /* @__PURE__ */
|
|
8414
|
+
return /* @__PURE__ */ jsxs72("div", { className: "ss-g-screen", "data-game": "matchday-predictor", "data-testid": "game-screen-matchday-predictor", children: [
|
|
8097
8415
|
header,
|
|
8098
|
-
/* @__PURE__ */
|
|
8099
|
-
/* @__PURE__ */
|
|
8416
|
+
/* @__PURE__ */ jsxs72("div", { className: "ss-g-body", children: [
|
|
8417
|
+
/* @__PURE__ */ jsx84(
|
|
8100
8418
|
ScoreCard,
|
|
8101
8419
|
{
|
|
8102
8420
|
home: config.homeTeam,
|
|
@@ -8107,12 +8425,12 @@ function MatchdayPredictorGame({
|
|
|
8107
8425
|
edit: { disabled, active: lastEdited, onStep: step }
|
|
8108
8426
|
}
|
|
8109
8427
|
),
|
|
8110
|
-
pool.length > 0 && /* @__PURE__ */
|
|
8111
|
-
/* @__PURE__ */
|
|
8112
|
-
/* @__PURE__ */
|
|
8113
|
-
/* @__PURE__ */
|
|
8428
|
+
pool.length > 0 && /* @__PURE__ */ jsxs72("section", { className: "ss-g-mp-scorer", children: [
|
|
8429
|
+
/* @__PURE__ */ jsxs72("div", { className: "ss-g-mp-sec-head", children: [
|
|
8430
|
+
/* @__PURE__ */ jsx84("h3", { children: t.firstScorer }),
|
|
8431
|
+
/* @__PURE__ */ jsx84("span", { children: t.optional })
|
|
8114
8432
|
] }),
|
|
8115
|
-
showSearch && /* @__PURE__ */
|
|
8433
|
+
showSearch && /* @__PURE__ */ jsx84(
|
|
8116
8434
|
SearchField,
|
|
8117
8435
|
{
|
|
8118
8436
|
id: searchId,
|
|
@@ -8124,9 +8442,9 @@ function MatchdayPredictorGame({
|
|
|
8124
8442
|
disabled
|
|
8125
8443
|
}
|
|
8126
8444
|
),
|
|
8127
|
-
/* @__PURE__ */
|
|
8445
|
+
/* @__PURE__ */ jsx84("div", { className: "ss-g-mp-grid", children: visible.map((p) => {
|
|
8128
8446
|
const selected = firstScorerPlayerId === p.playerId;
|
|
8129
|
-
return /* @__PURE__ */
|
|
8447
|
+
return /* @__PURE__ */ jsxs72(
|
|
8130
8448
|
"button",
|
|
8131
8449
|
{
|
|
8132
8450
|
type: "button",
|
|
@@ -8136,15 +8454,15 @@ function MatchdayPredictorGame({
|
|
|
8136
8454
|
disabled,
|
|
8137
8455
|
onClick: () => setFirstScorerPlayerId((id) => id === p.playerId ? null : p.playerId),
|
|
8138
8456
|
children: [
|
|
8139
|
-
selected && /* @__PURE__ */
|
|
8140
|
-
/* @__PURE__ */
|
|
8141
|
-
/* @__PURE__ */
|
|
8457
|
+
selected && /* @__PURE__ */ jsx84("span", { className: "ss-g-mp-pcheck", children: /* @__PURE__ */ jsx84(IconCheck, { size: 12 }) }),
|
|
8458
|
+
/* @__PURE__ */ jsx84(Silhouette, { size: 52, variant: selected ? "selected" : "default" }),
|
|
8459
|
+
/* @__PURE__ */ jsx84("span", { className: "ss-g-mp-pname", children: splitName(p.playerName).last })
|
|
8142
8460
|
]
|
|
8143
8461
|
},
|
|
8144
8462
|
p.playerId
|
|
8145
8463
|
);
|
|
8146
8464
|
}) }),
|
|
8147
|
-
/* @__PURE__ */
|
|
8465
|
+
/* @__PURE__ */ jsxs72(
|
|
8148
8466
|
"button",
|
|
8149
8467
|
{
|
|
8150
8468
|
type: "button",
|
|
@@ -8153,24 +8471,24 @@ function MatchdayPredictorGame({
|
|
|
8153
8471
|
disabled,
|
|
8154
8472
|
onClick: () => setFirstScorerPlayerId(null),
|
|
8155
8473
|
children: [
|
|
8156
|
-
/* @__PURE__ */
|
|
8474
|
+
/* @__PURE__ */ jsx84("span", { className: "ss-g-mp-radio", "aria-hidden": "true" }),
|
|
8157
8475
|
t.noScorer
|
|
8158
8476
|
]
|
|
8159
8477
|
}
|
|
8160
8478
|
)
|
|
8161
8479
|
] }),
|
|
8162
|
-
locked && /* @__PURE__ */
|
|
8480
|
+
locked && /* @__PURE__ */ jsx84("p", { className: "ss-g-mp-closed", children: t.closed })
|
|
8163
8481
|
] }),
|
|
8164
|
-
/* @__PURE__ */
|
|
8165
|
-
/* @__PURE__ */
|
|
8166
|
-
/* @__PURE__ */
|
|
8482
|
+
/* @__PURE__ */ jsxs72(FooterBar, { children: [
|
|
8483
|
+
/* @__PURE__ */ jsx84(GameButton, { variant: "primary", block: true, disabled, onClick: handleSubmit, children: submitting ? t.saving : t.save }),
|
|
8484
|
+
/* @__PURE__ */ jsx84("p", { className: "ss-g-mp-fun", children: t.forFun })
|
|
8167
8485
|
] })
|
|
8168
8486
|
] });
|
|
8169
8487
|
}
|
|
8170
8488
|
|
|
8171
8489
|
// src/components/games/StartingXiGame.tsx
|
|
8172
|
-
import { useId as
|
|
8173
|
-
import { Fragment as Fragment19, jsx as
|
|
8490
|
+
import { useId as useId8, useState as useState40 } from "react";
|
|
8491
|
+
import { Fragment as Fragment19, jsx as jsx85, jsxs as jsxs73 } from "react/jsx-runtime";
|
|
8174
8492
|
var POINTS_PER_STARTER = 8;
|
|
8175
8493
|
var XI_SIZE = 11;
|
|
8176
8494
|
var DEFAULT_FORMATION = "4-3-3";
|
|
@@ -8213,26 +8531,26 @@ function StartingXiGame({
|
|
|
8213
8531
|
lockAtUtc
|
|
8214
8532
|
}) {
|
|
8215
8533
|
const t = ui.games.startingXi;
|
|
8216
|
-
const [slotPlayers, setSlotPlayers] =
|
|
8217
|
-
const [active, setActive] =
|
|
8218
|
-
const [query, setQuery] =
|
|
8219
|
-
const searchId =
|
|
8534
|
+
const [slotPlayers, setSlotPlayers] = useState40(() => Array(XI_SIZE).fill(null));
|
|
8535
|
+
const [active, setActive] = useState40(0);
|
|
8536
|
+
const [query, setQuery] = useState40("");
|
|
8537
|
+
const searchId = useId8();
|
|
8220
8538
|
const clientState = parseClientState8(result?.clientStateJson);
|
|
8221
8539
|
const alreadyPlayed = result?.alreadyPlayed === true;
|
|
8222
|
-
const header = /* @__PURE__ */
|
|
8540
|
+
const header = /* @__PURE__ */ jsx85(
|
|
8223
8541
|
GameHeader,
|
|
8224
8542
|
{
|
|
8225
8543
|
title: gameTitle({ gameId: "starting-xi" }, ui.games.titles),
|
|
8226
8544
|
eyebrow: t.eyebrow,
|
|
8227
|
-
right: /* @__PURE__ */
|
|
8545
|
+
right: /* @__PURE__ */ jsx85(Chip, { variant: "accent", children: t.perStarter(POINTS_PER_STARTER) }),
|
|
8228
8546
|
onBack,
|
|
8229
8547
|
backLabel: ui.back
|
|
8230
8548
|
}
|
|
8231
8549
|
);
|
|
8232
8550
|
function statusScreen(title, score) {
|
|
8233
|
-
return /* @__PURE__ */
|
|
8551
|
+
return /* @__PURE__ */ jsxs73("div", { className: "ss-g-screen", "data-game": "starting-xi", "data-testid": "game-screen-starting-xi", children: [
|
|
8234
8552
|
header,
|
|
8235
|
-
/* @__PURE__ */
|
|
8553
|
+
/* @__PURE__ */ jsx85("div", { className: "ss-g-body", children: /* @__PURE__ */ jsx85(ResultCard, { tone: "neutral", title, score, onBack, ui }) })
|
|
8236
8554
|
] });
|
|
8237
8555
|
}
|
|
8238
8556
|
if (alreadyPlayed) {
|
|
@@ -8241,9 +8559,9 @@ function StartingXiGame({
|
|
|
8241
8559
|
if (clientState.status === "graded") return statusScreen(t.gradedLine(clientState.correctCount), clientState.score);
|
|
8242
8560
|
}
|
|
8243
8561
|
if (!config) {
|
|
8244
|
-
return /* @__PURE__ */
|
|
8562
|
+
return /* @__PURE__ */ jsxs73("div", { className: "ss-g-screen", "data-game": "starting-xi", "data-testid": "game-screen-starting-xi", children: [
|
|
8245
8563
|
header,
|
|
8246
|
-
/* @__PURE__ */
|
|
8564
|
+
/* @__PURE__ */ jsx85("div", { className: "ss-g-body ss-g-loading", children: ui.games.loading })
|
|
8247
8565
|
] });
|
|
8248
8566
|
}
|
|
8249
8567
|
const { formation, slots } = formationSlots(config.formation);
|
|
@@ -8278,27 +8596,27 @@ function StartingXiGame({
|
|
|
8278
8596
|
onSubmit(JSON.stringify({ predictedPlayerIds: slotPlayers }));
|
|
8279
8597
|
}
|
|
8280
8598
|
const segments = slotPlayers.map((p) => p !== null ? "current" : "todo");
|
|
8281
|
-
return /* @__PURE__ */
|
|
8599
|
+
return /* @__PURE__ */ jsxs73("div", { className: "ss-g-screen", "data-game": "starting-xi", "data-testid": "game-screen-starting-xi", children: [
|
|
8282
8600
|
header,
|
|
8283
|
-
/* @__PURE__ */
|
|
8601
|
+
/* @__PURE__ */ jsx85(
|
|
8284
8602
|
SegmentProgress,
|
|
8285
8603
|
{
|
|
8286
8604
|
segments,
|
|
8287
8605
|
ariaLabel: t.picked(pickedCount),
|
|
8288
8606
|
leftLabel: t.picked(pickedCount),
|
|
8289
8607
|
rightLabel: t.toGo(XI_SIZE - pickedCount),
|
|
8290
|
-
right: /* @__PURE__ */
|
|
8608
|
+
right: /* @__PURE__ */ jsx85(Chip, { children: formation })
|
|
8291
8609
|
}
|
|
8292
8610
|
),
|
|
8293
|
-
/* @__PURE__ */
|
|
8294
|
-
/* @__PURE__ */
|
|
8295
|
-
/* @__PURE__ */
|
|
8611
|
+
/* @__PURE__ */ jsxs73("div", { className: "ss-g-body", children: [
|
|
8612
|
+
/* @__PURE__ */ jsxs73("div", { className: "ss-g-xi-pitch", children: [
|
|
8613
|
+
/* @__PURE__ */ jsx85(PitchSvg, { variant: "half" }),
|
|
8296
8614
|
slots.map((s) => {
|
|
8297
8615
|
const playerId = slotPlayers[s.index] ?? null;
|
|
8298
8616
|
const player = playerId !== null ? byId.get(playerId) ?? null : null;
|
|
8299
8617
|
const name = player?.playerName ?? "";
|
|
8300
8618
|
const state = player ? "filled" : active === s.index ? "active" : "empty";
|
|
8301
|
-
return /* @__PURE__ */
|
|
8619
|
+
return /* @__PURE__ */ jsxs73(
|
|
8302
8620
|
"button",
|
|
8303
8621
|
{
|
|
8304
8622
|
type: "button",
|
|
@@ -8310,21 +8628,21 @@ function StartingXiGame({
|
|
|
8310
8628
|
disabled: submitting,
|
|
8311
8629
|
onClick: () => tapSlot(s.index),
|
|
8312
8630
|
children: [
|
|
8313
|
-
/* @__PURE__ */
|
|
8314
|
-
/* @__PURE__ */
|
|
8631
|
+
/* @__PURE__ */ jsx85("span", { className: "ss-g-xi-ring", "aria-hidden": "true", children: player ? player.jerseyNumber ?? "" : /* @__PURE__ */ jsx85(IconPlus, { size: 18 }) }),
|
|
8632
|
+
/* @__PURE__ */ jsx85("span", { className: "ss-g-xi-tag", "aria-hidden": "true", children: player ? splitName(name).last : s.label })
|
|
8315
8633
|
]
|
|
8316
8634
|
},
|
|
8317
8635
|
s.index
|
|
8318
8636
|
);
|
|
8319
8637
|
})
|
|
8320
8638
|
] }),
|
|
8321
|
-
/* @__PURE__ */
|
|
8322
|
-
/* @__PURE__ */
|
|
8323
|
-
/* @__PURE__ */
|
|
8324
|
-
/* @__PURE__ */
|
|
8325
|
-
] }) : /* @__PURE__ */
|
|
8326
|
-
activeSlot && /* @__PURE__ */
|
|
8327
|
-
/* @__PURE__ */
|
|
8639
|
+
/* @__PURE__ */ jsxs73("div", { className: "ss-g-xi-picker", children: [
|
|
8640
|
+
/* @__PURE__ */ jsx85("div", { className: "ss-g-xi-picker-head", children: activeSlot ? /* @__PURE__ */ jsxs73(Fragment19, { children: [
|
|
8641
|
+
/* @__PURE__ */ jsx85(Chip, { variant: "badge", children: activeSlot.label }),
|
|
8642
|
+
/* @__PURE__ */ jsx85("strong", { children: t.pickFor(activeSlot.label) })
|
|
8643
|
+
] }) : /* @__PURE__ */ jsx85("strong", { children: t.allPicked }) }),
|
|
8644
|
+
activeSlot && /* @__PURE__ */ jsxs73(Fragment19, { children: [
|
|
8645
|
+
/* @__PURE__ */ jsx85(
|
|
8328
8646
|
SearchField,
|
|
8329
8647
|
{
|
|
8330
8648
|
id: searchId,
|
|
@@ -8336,18 +8654,18 @@ function StartingXiGame({
|
|
|
8336
8654
|
disabled: submitting
|
|
8337
8655
|
}
|
|
8338
8656
|
),
|
|
8339
|
-
/* @__PURE__ */
|
|
8340
|
-
/* @__PURE__ */
|
|
8341
|
-
/* @__PURE__ */
|
|
8342
|
-
/* @__PURE__ */
|
|
8657
|
+
/* @__PURE__ */ jsx85("ul", { className: "ss-g-xi-list", children: available.map((p) => /* @__PURE__ */ jsx85("li", { children: /* @__PURE__ */ jsxs73("button", { type: "button", className: "ss-g-xi-opt", disabled: submitting, onClick: () => pick(p.playerId), children: [
|
|
8658
|
+
/* @__PURE__ */ jsx85("span", { className: "ss-g-xi-opt-no", "aria-hidden": "true", children: p.jerseyNumber ?? "" }),
|
|
8659
|
+
/* @__PURE__ */ jsx85("span", { className: "ss-g-xi-opt-name", children: p.playerName }),
|
|
8660
|
+
/* @__PURE__ */ jsx85("span", { className: "ss-g-xi-opt-pos", children: p.positionName })
|
|
8343
8661
|
] }) }, p.playerId)) })
|
|
8344
8662
|
] })
|
|
8345
8663
|
] })
|
|
8346
8664
|
] }),
|
|
8347
|
-
/* @__PURE__ */
|
|
8348
|
-
/* @__PURE__ */
|
|
8349
|
-
/* @__PURE__ */
|
|
8350
|
-
/* @__PURE__ */
|
|
8665
|
+
/* @__PURE__ */ jsxs73(FooterBar, { children: [
|
|
8666
|
+
/* @__PURE__ */ jsx85(GameButton, { variant: "primary", block: true, disabled: !canSubmit, onClick: handleSubmit, children: submitting ? t.submitting : t.submit }),
|
|
8667
|
+
/* @__PURE__ */ jsxs73("p", { className: "ss-g-xi-lock", children: [
|
|
8668
|
+
/* @__PURE__ */ jsx85(IconLock, {}),
|
|
8351
8669
|
lockAtUtc ? t.locksAt(ui.games.formatDayTime(lockAtUtc)) : t.locksSoon
|
|
8352
8670
|
] })
|
|
8353
8671
|
] })
|
|
@@ -8355,8 +8673,8 @@ function StartingXiGame({
|
|
|
8355
8673
|
}
|
|
8356
8674
|
|
|
8357
8675
|
// src/components/games/StatLadderGame.tsx
|
|
8358
|
-
import { useId as
|
|
8359
|
-
import { jsx as
|
|
8676
|
+
import { useId as useId9, useState as useState41 } from "react";
|
|
8677
|
+
import { jsx as jsx86, jsxs as jsxs74 } from "react/jsx-runtime";
|
|
8360
8678
|
function ladderClue(ladder) {
|
|
8361
8679
|
const mystery = ladder.find((r) => r.rank === 2);
|
|
8362
8680
|
if (!mystery) return null;
|
|
@@ -8378,9 +8696,9 @@ function parseClientState9(json) {
|
|
|
8378
8696
|
}
|
|
8379
8697
|
function NameStack({ name }) {
|
|
8380
8698
|
const { first, last } = splitName(name);
|
|
8381
|
-
return /* @__PURE__ */
|
|
8382
|
-
first && /* @__PURE__ */
|
|
8383
|
-
/* @__PURE__ */
|
|
8699
|
+
return /* @__PURE__ */ jsxs74("span", { className: "ss-g-sl-name", children: [
|
|
8700
|
+
first && /* @__PURE__ */ jsx86("small", { children: `${first[0]}.` }),
|
|
8701
|
+
/* @__PURE__ */ jsx86("b", { children: last })
|
|
8384
8702
|
] });
|
|
8385
8703
|
}
|
|
8386
8704
|
function StatLadderGame({
|
|
@@ -8392,16 +8710,16 @@ function StatLadderGame({
|
|
|
8392
8710
|
onBack
|
|
8393
8711
|
}) {
|
|
8394
8712
|
const t = ui.games.statLadder;
|
|
8395
|
-
const [query, setQuery] =
|
|
8396
|
-
const [selectedId, setSelectedId] =
|
|
8397
|
-
const searchId =
|
|
8713
|
+
const [query, setQuery] = useState41("");
|
|
8714
|
+
const [selectedId, setSelectedId] = useState41(null);
|
|
8715
|
+
const searchId = useId9();
|
|
8398
8716
|
const clientState = parseClientState9(result?.clientStateJson);
|
|
8399
8717
|
const revealed = clientState != null;
|
|
8400
|
-
const header = /* @__PURE__ */
|
|
8718
|
+
const header = /* @__PURE__ */ jsx86(GameHeader, { title: gameTitle({ gameId: "stat-ladder" }, ui.games.titles), eyebrow: t.eyebrow, onBack, backLabel: ui.back });
|
|
8401
8719
|
if (!config) {
|
|
8402
|
-
return /* @__PURE__ */
|
|
8720
|
+
return /* @__PURE__ */ jsxs74("div", { className: "ss-g-screen", "data-game": "stat-ladder", "data-testid": "game-screen-stat-ladder", children: [
|
|
8403
8721
|
header,
|
|
8404
|
-
/* @__PURE__ */
|
|
8722
|
+
/* @__PURE__ */ jsx86("div", { className: "ss-g-body ss-g-loading", children: ui.games.loading })
|
|
8405
8723
|
] });
|
|
8406
8724
|
}
|
|
8407
8725
|
const question = t.question(config.statLabel);
|
|
@@ -8413,45 +8731,45 @@ function StatLadderGame({
|
|
|
8413
8731
|
if (selectedId === null || submitting || revealed) return;
|
|
8414
8732
|
onSubmit(JSON.stringify({ guessedPlayerId: selectedId }));
|
|
8415
8733
|
}
|
|
8416
|
-
return /* @__PURE__ */
|
|
8734
|
+
return /* @__PURE__ */ jsxs74("div", { className: "ss-g-screen", "data-game": "stat-ladder", "data-testid": "game-screen-stat-ladder", children: [
|
|
8417
8735
|
header,
|
|
8418
|
-
/* @__PURE__ */
|
|
8419
|
-
!revealed && /* @__PURE__ */
|
|
8420
|
-
/* @__PURE__ */
|
|
8421
|
-
/* @__PURE__ */
|
|
8422
|
-
/* @__PURE__ */
|
|
8736
|
+
/* @__PURE__ */ jsxs74("div", { className: "ss-g-body", children: [
|
|
8737
|
+
!revealed && /* @__PURE__ */ jsx86(PointsLadderRow, { ladder: config.pointsLadder, guessesUsed: 0, ui }),
|
|
8738
|
+
/* @__PURE__ */ jsxs74("div", { className: "ss-g-sl-prompt", children: [
|
|
8739
|
+
/* @__PURE__ */ jsx86(Chip, { variant: "accent", icon: /* @__PURE__ */ jsx86(IconShield, { size: 14 }), className: "ss-g-sl-stat", children: config.statLabel }),
|
|
8740
|
+
/* @__PURE__ */ jsxs74("h3", { className: "ss-g-sl-q", children: [
|
|
8423
8741
|
question.pre,
|
|
8424
|
-
/* @__PURE__ */
|
|
8742
|
+
/* @__PURE__ */ jsx86("em", { children: question.emph }),
|
|
8425
8743
|
question.post
|
|
8426
8744
|
] })
|
|
8427
8745
|
] }),
|
|
8428
|
-
/* @__PURE__ */
|
|
8429
|
-
(rung) => rung.rank === 2 ? /* @__PURE__ */
|
|
8746
|
+
/* @__PURE__ */ jsx86("ol", { className: "ss-g-sl-rungs", children: rungs.map(
|
|
8747
|
+
(rung) => rung.rank === 2 ? /* @__PURE__ */ jsxs74(
|
|
8430
8748
|
"li",
|
|
8431
8749
|
{
|
|
8432
8750
|
className: "ss-g-sl-rung ss-g-sl-rung--mystery",
|
|
8433
8751
|
"data-testid": "sl-mystery-rung",
|
|
8434
8752
|
"data-result": revealed ? clientState.isCorrect ? "correct" : "wrong" : void 0,
|
|
8435
8753
|
children: [
|
|
8436
|
-
/* @__PURE__ */
|
|
8437
|
-
revealed ? /* @__PURE__ */
|
|
8438
|
-
revealed ? /* @__PURE__ */
|
|
8439
|
-
/* @__PURE__ */
|
|
8754
|
+
/* @__PURE__ */ jsx86("span", { className: "ss-g-sl-rank", children: "2" }),
|
|
8755
|
+
revealed ? /* @__PURE__ */ jsx86(PlayerAvatar, { name: clientState.revealedRank2.playerName, className: "ss-g-sl-av" }) : /* @__PURE__ */ jsx86(Silhouette, { size: 52, variant: "mystery" }),
|
|
8756
|
+
revealed ? /* @__PURE__ */ jsx86(NameStack, { name: clientState.revealedRank2.playerName }) : /* @__PURE__ */ jsx86("span", { className: "ss-g-sl-who", children: t.whoSecond }),
|
|
8757
|
+
/* @__PURE__ */ jsx86("span", { className: "ss-g-sl-val ss-g-sl-val--mystery", children: rung.statValue })
|
|
8440
8758
|
]
|
|
8441
8759
|
},
|
|
8442
8760
|
rung.rank
|
|
8443
|
-
) : /* @__PURE__ */
|
|
8444
|
-
/* @__PURE__ */
|
|
8445
|
-
/* @__PURE__ */
|
|
8446
|
-
/* @__PURE__ */
|
|
8447
|
-
/* @__PURE__ */
|
|
8761
|
+
) : /* @__PURE__ */ jsxs74("li", { className: "ss-g-sl-rung", children: [
|
|
8762
|
+
/* @__PURE__ */ jsx86("span", { className: "ss-g-sl-rank", children: rung.rank }),
|
|
8763
|
+
/* @__PURE__ */ jsx86(PlayerAvatar, { name: rung.playerName ?? "?", className: "ss-g-sl-av" }),
|
|
8764
|
+
/* @__PURE__ */ jsx86(NameStack, { name: rung.playerName ?? "?" }),
|
|
8765
|
+
/* @__PURE__ */ jsx86("span", { className: "ss-g-sl-val", children: rung.statValue })
|
|
8448
8766
|
] }, rung.rank)
|
|
8449
8767
|
) }),
|
|
8450
|
-
clue && /* @__PURE__ */
|
|
8451
|
-
/* @__PURE__ */
|
|
8452
|
-
/* @__PURE__ */
|
|
8768
|
+
clue && /* @__PURE__ */ jsxs74("p", { className: "ss-g-sl-clue", children: [
|
|
8769
|
+
/* @__PURE__ */ jsx86(IconBulb, {}),
|
|
8770
|
+
/* @__PURE__ */ jsx86("span", { children: t.clue(clue, config.statLabel) })
|
|
8453
8771
|
] }),
|
|
8454
|
-
!revealed && /* @__PURE__ */
|
|
8772
|
+
!revealed && /* @__PURE__ */ jsx86("ul", { className: "ss-g-sl-pool", children: pool.map((p) => /* @__PURE__ */ jsx86("li", { children: /* @__PURE__ */ jsxs74(
|
|
8455
8773
|
"button",
|
|
8456
8774
|
{
|
|
8457
8775
|
type: "button",
|
|
@@ -8464,13 +8782,13 @@ function StatLadderGame({
|
|
|
8464
8782
|
setQuery(p.playerName);
|
|
8465
8783
|
},
|
|
8466
8784
|
children: [
|
|
8467
|
-
/* @__PURE__ */
|
|
8468
|
-
/* @__PURE__ */
|
|
8469
|
-
selectedId === p.playerId && /* @__PURE__ */
|
|
8785
|
+
/* @__PURE__ */ jsx86(PlayerAvatar, { name: p.playerName, className: "ss-g-sl-opt-av" }),
|
|
8786
|
+
/* @__PURE__ */ jsx86("span", { className: "ss-g-sl-opt-name", children: p.playerName }),
|
|
8787
|
+
selectedId === p.playerId && /* @__PURE__ */ jsx86(IconCheck, {})
|
|
8470
8788
|
]
|
|
8471
8789
|
}
|
|
8472
8790
|
) }, p.playerId)) }),
|
|
8473
|
-
revealed && /* @__PURE__ */
|
|
8791
|
+
revealed && /* @__PURE__ */ jsx86(
|
|
8474
8792
|
ResultCard,
|
|
8475
8793
|
{
|
|
8476
8794
|
tone: clientState.isCorrect ? "win" : "lose",
|
|
@@ -8481,8 +8799,8 @@ function StatLadderGame({
|
|
|
8481
8799
|
}
|
|
8482
8800
|
)
|
|
8483
8801
|
] }),
|
|
8484
|
-
!revealed && /* @__PURE__ */
|
|
8485
|
-
/* @__PURE__ */
|
|
8802
|
+
!revealed && /* @__PURE__ */ jsx86(FooterBar, { children: /* @__PURE__ */ jsxs74("div", { className: "ss-g-sl-guess", children: [
|
|
8803
|
+
/* @__PURE__ */ jsx86(
|
|
8486
8804
|
SearchField,
|
|
8487
8805
|
{
|
|
8488
8806
|
id: searchId,
|
|
@@ -8497,13 +8815,13 @@ function StatLadderGame({
|
|
|
8497
8815
|
disabled: submitting
|
|
8498
8816
|
}
|
|
8499
8817
|
),
|
|
8500
|
-
/* @__PURE__ */
|
|
8818
|
+
/* @__PURE__ */ jsx86(GameButton, { variant: "primary", disabled: selectedId === null || submitting, onClick: guess, children: t.guess })
|
|
8501
8819
|
] }) })
|
|
8502
8820
|
] });
|
|
8503
8821
|
}
|
|
8504
8822
|
|
|
8505
8823
|
// src/components/games/FanMotmGame.tsx
|
|
8506
|
-
import { jsx as
|
|
8824
|
+
import { jsx as jsx87, jsxs as jsxs75 } from "react/jsx-runtime";
|
|
8507
8825
|
function parseClientState10(json) {
|
|
8508
8826
|
if (!json) return null;
|
|
8509
8827
|
try {
|
|
@@ -8524,20 +8842,20 @@ function FanMotmGame({
|
|
|
8524
8842
|
const clientState = parseClientState10(result?.clientStateJson);
|
|
8525
8843
|
const alreadyVoted = result?.alreadyPlayed === true;
|
|
8526
8844
|
const pickedId = clientState?.pickedPlayerId ?? null;
|
|
8527
|
-
const header = /* @__PURE__ */
|
|
8845
|
+
const header = /* @__PURE__ */ jsx87(
|
|
8528
8846
|
GameHeader,
|
|
8529
8847
|
{
|
|
8530
8848
|
title: t.title,
|
|
8531
8849
|
eyebrow: t.eyebrow,
|
|
8532
|
-
right: alreadyVoted ? /* @__PURE__ */
|
|
8850
|
+
right: alreadyVoted ? /* @__PURE__ */ jsx87(Chip, { variant: "success", icon: /* @__PURE__ */ jsx87(IconCheck, {}), children: t.voted }) : void 0,
|
|
8533
8851
|
onBack,
|
|
8534
8852
|
backLabel: ui.back
|
|
8535
8853
|
}
|
|
8536
8854
|
);
|
|
8537
8855
|
if (!config) {
|
|
8538
|
-
return /* @__PURE__ */
|
|
8856
|
+
return /* @__PURE__ */ jsxs75("div", { className: "ss-g-screen", "data-game": "fan-motm", "data-testid": "game-screen-fan-motm", children: [
|
|
8539
8857
|
header,
|
|
8540
|
-
/* @__PURE__ */
|
|
8858
|
+
/* @__PURE__ */ jsx87("div", { className: "ss-g-body ss-g-loading", children: ui.games.loading })
|
|
8541
8859
|
] });
|
|
8542
8860
|
}
|
|
8543
8861
|
const picked = config.candidates.find((c) => c.playerId === pickedId) ?? null;
|
|
@@ -8545,12 +8863,12 @@ function FanMotmGame({
|
|
|
8545
8863
|
if (alreadyVoted || submitting) return;
|
|
8546
8864
|
onSubmit(JSON.stringify({ pickedPlayerId: candidateId }));
|
|
8547
8865
|
}
|
|
8548
|
-
return /* @__PURE__ */
|
|
8866
|
+
return /* @__PURE__ */ jsxs75("div", { className: "ss-g-screen", "data-game": "fan-motm", "data-testid": "game-screen-fan-motm", children: [
|
|
8549
8867
|
header,
|
|
8550
|
-
/* @__PURE__ */
|
|
8551
|
-
/* @__PURE__ */
|
|
8868
|
+
/* @__PURE__ */ jsxs75("div", { className: "ss-g-body", children: [
|
|
8869
|
+
/* @__PURE__ */ jsx87("ul", { className: "ss-g-motm-list", children: config.candidates.map((c) => {
|
|
8552
8870
|
const isVoted = alreadyVoted && pickedId === c.playerId;
|
|
8553
|
-
return /* @__PURE__ */
|
|
8871
|
+
return /* @__PURE__ */ jsx87("li", { children: /* @__PURE__ */ jsxs75(
|
|
8554
8872
|
"button",
|
|
8555
8873
|
{
|
|
8556
8874
|
type: "button",
|
|
@@ -8559,24 +8877,24 @@ function FanMotmGame({
|
|
|
8559
8877
|
disabled: alreadyVoted || submitting,
|
|
8560
8878
|
onClick: () => handleVote(c.playerId),
|
|
8561
8879
|
children: [
|
|
8562
|
-
/* @__PURE__ */
|
|
8563
|
-
/* @__PURE__ */
|
|
8564
|
-
isVoted && /* @__PURE__ */
|
|
8880
|
+
/* @__PURE__ */ jsx87(PlayerAvatar, { name: c.playerName, className: "ss-g-motm-av" }),
|
|
8881
|
+
/* @__PURE__ */ jsx87("span", { className: "ss-g-motm-name", children: c.playerName }),
|
|
8882
|
+
isVoted && /* @__PURE__ */ jsx87(Chip, { variant: "accent", className: "ss-g-motm-pill", children: t.yourVote })
|
|
8565
8883
|
]
|
|
8566
8884
|
}
|
|
8567
8885
|
) }, c.playerId);
|
|
8568
8886
|
}) }),
|
|
8569
|
-
alreadyVoted && picked && /* @__PURE__ */
|
|
8887
|
+
alreadyVoted && picked && /* @__PURE__ */ jsx87(ResultCard, { tone: "neutral", title: t.youVoted(picked.playerName), detail: t.thanks, onBack, ui })
|
|
8570
8888
|
] }),
|
|
8571
|
-
/* @__PURE__ */
|
|
8572
|
-
!alreadyVoted && /* @__PURE__ */
|
|
8573
|
-
/* @__PURE__ */
|
|
8889
|
+
/* @__PURE__ */ jsxs75(FooterBar, { children: [
|
|
8890
|
+
!alreadyVoted && /* @__PURE__ */ jsx87("p", { className: "ss-g-motm-foot", children: t.tapToVote }),
|
|
8891
|
+
/* @__PURE__ */ jsx87("p", { className: "ss-g-motm-fun", children: t.forFun })
|
|
8574
8892
|
] })
|
|
8575
8893
|
] });
|
|
8576
8894
|
}
|
|
8577
8895
|
|
|
8578
8896
|
// src/components/GameScreenHost.tsx
|
|
8579
|
-
import { jsx as
|
|
8897
|
+
import { jsx as jsx88 } from "react/jsx-runtime";
|
|
8580
8898
|
var FIXTURE_GAME_IDS = /* @__PURE__ */ new Set([
|
|
8581
8899
|
"matchday-predictor",
|
|
8582
8900
|
"starting-xi",
|
|
@@ -8600,8 +8918,8 @@ function GameScreenHost({
|
|
|
8600
8918
|
ui
|
|
8601
8919
|
}) {
|
|
8602
8920
|
const { gameId, fixtureId, gameDay = "", lockAtUtc = null } = selected;
|
|
8603
|
-
const [configJson, setConfigJson] =
|
|
8604
|
-
|
|
8921
|
+
const [configJson, setConfigJson] = useState42(null);
|
|
8922
|
+
useEffect24(() => {
|
|
8605
8923
|
setConfigJson(null);
|
|
8606
8924
|
if (!conversation) return;
|
|
8607
8925
|
let cancelled = false;
|
|
@@ -8624,12 +8942,12 @@ function GameScreenHost({
|
|
|
8624
8942
|
fixtureId: fixtureId || void 0,
|
|
8625
8943
|
locale: ui.games.lang
|
|
8626
8944
|
});
|
|
8627
|
-
|
|
8945
|
+
useEffect24(() => {
|
|
8628
8946
|
if (conversation) hydrate();
|
|
8629
8947
|
}, [conversation, gameId]);
|
|
8630
|
-
const hydrateRef =
|
|
8948
|
+
const hydrateRef = useRef20(hydrate);
|
|
8631
8949
|
hydrateRef.current = hydrate;
|
|
8632
|
-
|
|
8950
|
+
useEffect24(() => {
|
|
8633
8951
|
if (!FIXTURE_GAME_IDS.has(gameId)) return;
|
|
8634
8952
|
if (rawStatus !== "pending") return;
|
|
8635
8953
|
const timerId = setInterval(() => {
|
|
@@ -8652,7 +8970,7 @@ function GameScreenHost({
|
|
|
8652
8970
|
function renderScreen() {
|
|
8653
8971
|
switch (gameId) {
|
|
8654
8972
|
case "mystery-tiger":
|
|
8655
|
-
return /* @__PURE__ */
|
|
8973
|
+
return /* @__PURE__ */ jsx88(
|
|
8656
8974
|
MysteryTigerGame,
|
|
8657
8975
|
{
|
|
8658
8976
|
...sharedProps,
|
|
@@ -8660,7 +8978,7 @@ function GameScreenHost({
|
|
|
8660
8978
|
}
|
|
8661
8979
|
);
|
|
8662
8980
|
case "higher-or-lower":
|
|
8663
|
-
return /* @__PURE__ */
|
|
8981
|
+
return /* @__PURE__ */ jsx88(
|
|
8664
8982
|
HigherOrLowerGame,
|
|
8665
8983
|
{
|
|
8666
8984
|
...sharedProps,
|
|
@@ -8668,7 +8986,7 @@ function GameScreenHost({
|
|
|
8668
8986
|
}
|
|
8669
8987
|
);
|
|
8670
8988
|
case "career-path":
|
|
8671
|
-
return /* @__PURE__ */
|
|
8989
|
+
return /* @__PURE__ */ jsx88(
|
|
8672
8990
|
CareerPathGame,
|
|
8673
8991
|
{
|
|
8674
8992
|
...sharedProps,
|
|
@@ -8677,7 +8995,7 @@ function GameScreenHost({
|
|
|
8677
8995
|
);
|
|
8678
8996
|
case "beat-the-grid": {
|
|
8679
8997
|
const btgConfig = safeParseConfig(configJson);
|
|
8680
|
-
return /* @__PURE__ */
|
|
8998
|
+
return /* @__PURE__ */ jsx88(
|
|
8681
8999
|
BeatTheGridGame,
|
|
8682
9000
|
{
|
|
8683
9001
|
...sharedProps,
|
|
@@ -8687,7 +9005,7 @@ function GameScreenHost({
|
|
|
8687
9005
|
);
|
|
8688
9006
|
}
|
|
8689
9007
|
case "guess-the-xi":
|
|
8690
|
-
return /* @__PURE__ */
|
|
9008
|
+
return /* @__PURE__ */ jsx88(
|
|
8691
9009
|
GuessTheXiGame,
|
|
8692
9010
|
{
|
|
8693
9011
|
...sharedProps,
|
|
@@ -8695,7 +9013,7 @@ function GameScreenHost({
|
|
|
8695
9013
|
}
|
|
8696
9014
|
);
|
|
8697
9015
|
case "daily-quiz":
|
|
8698
|
-
return /* @__PURE__ */
|
|
9016
|
+
return /* @__PURE__ */ jsx88(
|
|
8699
9017
|
DailyQuizGame,
|
|
8700
9018
|
{
|
|
8701
9019
|
...sharedProps,
|
|
@@ -8703,7 +9021,7 @@ function GameScreenHost({
|
|
|
8703
9021
|
}
|
|
8704
9022
|
);
|
|
8705
9023
|
case "matchday-predictor":
|
|
8706
|
-
return /* @__PURE__ */
|
|
9024
|
+
return /* @__PURE__ */ jsx88(
|
|
8707
9025
|
MatchdayPredictorGame,
|
|
8708
9026
|
{
|
|
8709
9027
|
...sharedProps,
|
|
@@ -8711,7 +9029,7 @@ function GameScreenHost({
|
|
|
8711
9029
|
}
|
|
8712
9030
|
);
|
|
8713
9031
|
case "starting-xi":
|
|
8714
|
-
return /* @__PURE__ */
|
|
9032
|
+
return /* @__PURE__ */ jsx88(
|
|
8715
9033
|
StartingXiGame,
|
|
8716
9034
|
{
|
|
8717
9035
|
...sharedProps,
|
|
@@ -8719,7 +9037,7 @@ function GameScreenHost({
|
|
|
8719
9037
|
}
|
|
8720
9038
|
);
|
|
8721
9039
|
case "stat-ladder":
|
|
8722
|
-
return /* @__PURE__ */
|
|
9040
|
+
return /* @__PURE__ */ jsx88(
|
|
8723
9041
|
StatLadderGame,
|
|
8724
9042
|
{
|
|
8725
9043
|
...sharedProps,
|
|
@@ -8727,7 +9045,7 @@ function GameScreenHost({
|
|
|
8727
9045
|
}
|
|
8728
9046
|
);
|
|
8729
9047
|
case "fan-motm":
|
|
8730
|
-
return /* @__PURE__ */
|
|
9048
|
+
return /* @__PURE__ */ jsx88(
|
|
8731
9049
|
FanMotmGame,
|
|
8732
9050
|
{
|
|
8733
9051
|
...sharedProps,
|
|
@@ -8735,10 +9053,10 @@ function GameScreenHost({
|
|
|
8735
9053
|
}
|
|
8736
9054
|
);
|
|
8737
9055
|
default:
|
|
8738
|
-
return /* @__PURE__ */
|
|
9056
|
+
return /* @__PURE__ */ jsx88("div", { className: "ss-g-screen", "data-testid": `game-screen-${gameId}`, children: /* @__PURE__ */ jsx88(GameHeader, { title: gameTitle({ gameId }, ui.games.titles), onBack, backLabel: ui.back }) });
|
|
8739
9057
|
}
|
|
8740
9058
|
}
|
|
8741
|
-
return /* @__PURE__ */
|
|
9059
|
+
return /* @__PURE__ */ jsx88("div", { className: "ss-w-gscreen", "data-testid": "gscreen", "data-lock-at": lockAtUtc ?? void 0, children: renderScreen() });
|
|
8742
9060
|
}
|
|
8743
9061
|
|
|
8744
9062
|
// src/components/games/ui/fonts.ts
|
|
@@ -8755,7 +9073,7 @@ function ensureGamesFonts(doc = document) {
|
|
|
8755
9073
|
}
|
|
8756
9074
|
|
|
8757
9075
|
// src/components/GamesPanel.tsx
|
|
8758
|
-
import { jsx as
|
|
9076
|
+
import { jsx as jsx89 } from "react/jsx-runtime";
|
|
8759
9077
|
function GamesPanel({
|
|
8760
9078
|
loggedIn,
|
|
8761
9079
|
games,
|
|
@@ -8764,13 +9082,13 @@ function GamesPanel({
|
|
|
8764
9082
|
leaderboard,
|
|
8765
9083
|
refreshHub
|
|
8766
9084
|
}) {
|
|
8767
|
-
const [selected, setSelected] =
|
|
8768
|
-
|
|
9085
|
+
const [selected, setSelected] = useState43(null);
|
|
9086
|
+
useEffect25(() => {
|
|
8769
9087
|
ensureGamesFonts();
|
|
8770
9088
|
}, []);
|
|
8771
|
-
if (!loggedIn) return /* @__PURE__ */
|
|
9089
|
+
if (!loggedIn) return /* @__PURE__ */ jsx89(GamesLoginWall, { ui });
|
|
8772
9090
|
if (selected !== null) {
|
|
8773
|
-
return /* @__PURE__ */
|
|
9091
|
+
return /* @__PURE__ */ jsx89("div", { className: "ss-w-gscreen-wrap", lang: ui.games.lang, children: /* @__PURE__ */ jsx89(
|
|
8774
9092
|
GameScreenHost,
|
|
8775
9093
|
{
|
|
8776
9094
|
selected,
|
|
@@ -8784,7 +9102,7 @@ function GamesPanel({
|
|
|
8784
9102
|
}
|
|
8785
9103
|
) });
|
|
8786
9104
|
}
|
|
8787
|
-
return /* @__PURE__ */
|
|
9105
|
+
return /* @__PURE__ */ jsx89("div", { className: "ss-g-hub-wrap", "data-testid": "games-hub", lang: ui.games.lang, children: /* @__PURE__ */ jsx89(
|
|
8788
9106
|
GamesHub,
|
|
8789
9107
|
{
|
|
8790
9108
|
games,
|
|
@@ -8796,10 +9114,10 @@ function GamesPanel({
|
|
|
8796
9114
|
}
|
|
8797
9115
|
|
|
8798
9116
|
// src/components/Leaderboard.tsx
|
|
8799
|
-
import { useState as
|
|
9117
|
+
import { useState as useState44 } from "react";
|
|
8800
9118
|
|
|
8801
9119
|
// src/components/LeaderboardRow.tsx
|
|
8802
|
-
import { jsx as
|
|
9120
|
+
import { jsx as jsx90, jsxs as jsxs76 } from "react/jsx-runtime";
|
|
8803
9121
|
function formatPoints(n) {
|
|
8804
9122
|
return n.toLocaleString("en");
|
|
8805
9123
|
}
|
|
@@ -8808,14 +9126,14 @@ function LeaderboardWeeklyRow({
|
|
|
8808
9126
|
isMe
|
|
8809
9127
|
}) {
|
|
8810
9128
|
const rankClass = `ss-w-lb2-rank${row.rank <= 3 ? " ss-w-lb2-rank--top3" : ""}`;
|
|
8811
|
-
return /* @__PURE__ */
|
|
8812
|
-
/* @__PURE__ */
|
|
9129
|
+
return /* @__PURE__ */ jsxs76("div", { className: `ss-w-lb2-row${isMe ? " ss-w-lb2-row--you" : ""}`, children: [
|
|
9130
|
+
/* @__PURE__ */ jsxs76("span", { className: rankClass, children: [
|
|
8813
9131
|
"#",
|
|
8814
9132
|
row.rank
|
|
8815
9133
|
] }),
|
|
8816
|
-
/* @__PURE__ */
|
|
8817
|
-
/* @__PURE__ */
|
|
8818
|
-
row.currentStreak > 0 && /* @__PURE__ */
|
|
9134
|
+
/* @__PURE__ */ jsx90("span", { className: "ss-w-lb2-handle", children: row.handle }),
|
|
9135
|
+
/* @__PURE__ */ jsx90("span", { className: "ss-w-lb2-points", children: formatPoints(row.points) }),
|
|
9136
|
+
row.currentStreak > 0 && /* @__PURE__ */ jsxs76("span", { className: "ss-w-lb2-streak", children: [
|
|
8819
9137
|
"\u{1F525} ",
|
|
8820
9138
|
row.currentStreak
|
|
8821
9139
|
] })
|
|
@@ -8826,18 +9144,18 @@ function LeaderboardAllTimeRow({
|
|
|
8826
9144
|
isMe
|
|
8827
9145
|
}) {
|
|
8828
9146
|
const rankClass = `ss-w-lb2-rank${row.rank <= 3 ? " ss-w-lb2-rank--top3" : ""}`;
|
|
8829
|
-
return /* @__PURE__ */
|
|
8830
|
-
/* @__PURE__ */
|
|
9147
|
+
return /* @__PURE__ */ jsxs76("div", { className: `ss-w-lb2-row${isMe ? " ss-w-lb2-row--you" : ""}`, children: [
|
|
9148
|
+
/* @__PURE__ */ jsxs76("span", { className: rankClass, children: [
|
|
8831
9149
|
"#",
|
|
8832
9150
|
row.rank
|
|
8833
9151
|
] }),
|
|
8834
|
-
/* @__PURE__ */
|
|
8835
|
-
/* @__PURE__ */
|
|
9152
|
+
/* @__PURE__ */ jsx90("span", { className: "ss-w-lb2-handle", children: row.handle }),
|
|
9153
|
+
/* @__PURE__ */ jsx90("span", { className: "ss-w-lb2-points", children: formatPoints(row.allTimePoints) })
|
|
8836
9154
|
] });
|
|
8837
9155
|
}
|
|
8838
9156
|
|
|
8839
9157
|
// src/components/LeaderboardEmpty.tsx
|
|
8840
|
-
import { jsx as
|
|
9158
|
+
import { jsx as jsx91, jsxs as jsxs77 } from "react/jsx-runtime";
|
|
8841
9159
|
function LeaderboardEmpty({
|
|
8842
9160
|
segment,
|
|
8843
9161
|
lastWeek,
|
|
@@ -8846,48 +9164,48 @@ function LeaderboardEmpty({
|
|
|
8846
9164
|
ui
|
|
8847
9165
|
}) {
|
|
8848
9166
|
if (segment === "alltime") {
|
|
8849
|
-
return /* @__PURE__ */
|
|
8850
|
-
/* @__PURE__ */
|
|
8851
|
-
/* @__PURE__ */
|
|
9167
|
+
return /* @__PURE__ */ jsxs77("div", { className: "ss-w-lb-empty ss-w-lb-empty--alltime", children: [
|
|
9168
|
+
/* @__PURE__ */ jsx91("div", { className: "ss-w-lb-empty-icon", "aria-hidden": "true", children: "\u{1F4CA}" }),
|
|
9169
|
+
/* @__PURE__ */ jsx91("p", { className: "ss-w-lb-empty-body", children: ui.leaderboardAllTimeEmpty })
|
|
8852
9170
|
] });
|
|
8853
9171
|
}
|
|
8854
9172
|
const fresh = lastWeek != null;
|
|
8855
9173
|
const title = fresh ? ui.leaderboardEmptyFreshTitle : ui.leaderboardEmptyColdTitle;
|
|
8856
9174
|
const body = fresh ? ui.leaderboardEmptyFreshBody : ui.leaderboardEmptyColdBody;
|
|
8857
|
-
return /* @__PURE__ */
|
|
8858
|
-
weeklyPrize && /* @__PURE__ */
|
|
8859
|
-
/* @__PURE__ */
|
|
8860
|
-
/* @__PURE__ */
|
|
9175
|
+
return /* @__PURE__ */ jsxs77("div", { className: "ss-w-lb-empty", children: [
|
|
9176
|
+
weeklyPrize && /* @__PURE__ */ jsxs77("div", { className: "ss-w-prize", children: [
|
|
9177
|
+
/* @__PURE__ */ jsx91("span", { className: "ss-w-prize-icon", "aria-hidden": "true", children: "\u{1F3C6}" }),
|
|
9178
|
+
/* @__PURE__ */ jsx91("div", { className: "ss-w-prize-body", children: /* @__PURE__ */ jsx91("span", { className: "ss-w-prize-text", children: weeklyPrize }) })
|
|
8861
9179
|
] }),
|
|
8862
|
-
/* @__PURE__ */
|
|
8863
|
-
/* @__PURE__ */
|
|
8864
|
-
/* @__PURE__ */
|
|
8865
|
-
/* @__PURE__ */
|
|
8866
|
-
onPlay && /* @__PURE__ */
|
|
9180
|
+
/* @__PURE__ */ jsxs77("div", { className: "ss-w-lb-empty-hero", children: [
|
|
9181
|
+
/* @__PURE__ */ jsx91("div", { className: "ss-w-lb-empty-icon", "aria-hidden": "true", children: fresh ? "\u{1F3C6}" : "\u{1F3AE}" }),
|
|
9182
|
+
/* @__PURE__ */ jsx91("h4", { className: "ss-w-lb-empty-title", children: title }),
|
|
9183
|
+
/* @__PURE__ */ jsx91("p", { className: "ss-w-lb-empty-body", children: body }),
|
|
9184
|
+
onPlay && /* @__PURE__ */ jsx91("button", { type: "button", className: "ss-w-lb-empty-cta", onClick: onPlay, children: ui.leaderboardEmptyCta })
|
|
8867
9185
|
] }),
|
|
8868
|
-
fresh && lastWeek && /* @__PURE__ */
|
|
8869
|
-
/* @__PURE__ */
|
|
8870
|
-
/* @__PURE__ */
|
|
8871
|
-
/* @__PURE__ */
|
|
8872
|
-
/* @__PURE__ */
|
|
9186
|
+
fresh && lastWeek && /* @__PURE__ */ jsxs77("div", { className: "ss-w-lb-last", children: [
|
|
9187
|
+
/* @__PURE__ */ jsx91("span", { className: "ss-w-lb-last-label", children: ui.leaderboardLastWeekLabel }),
|
|
9188
|
+
/* @__PURE__ */ jsx91("span", { className: "ss-w-lb-last-champ", "aria-hidden": "true", children: "\u{1F947}" }),
|
|
9189
|
+
/* @__PURE__ */ jsx91("span", { className: "ss-w-lb-last-handle", children: lastWeek.handle }),
|
|
9190
|
+
/* @__PURE__ */ jsx91("span", { className: "ss-w-lb-last-points", children: formatPoints(lastWeek.points) })
|
|
8873
9191
|
] })
|
|
8874
9192
|
] });
|
|
8875
9193
|
}
|
|
8876
9194
|
|
|
8877
9195
|
// src/components/Leaderboard.tsx
|
|
8878
|
-
import { Fragment as Fragment20, jsx as
|
|
9196
|
+
import { Fragment as Fragment20, jsx as jsx92, jsxs as jsxs78 } from "react/jsx-runtime";
|
|
8879
9197
|
function Leaderboard({
|
|
8880
9198
|
data,
|
|
8881
9199
|
ui,
|
|
8882
9200
|
onPlay
|
|
8883
9201
|
}) {
|
|
8884
|
-
const [segment, setSegment] =
|
|
9202
|
+
const [segment, setSegment] = useState44("weekly");
|
|
8885
9203
|
const myRow = segment === "weekly" ? data.myWeeklyRow : data.myAllTimeRow;
|
|
8886
9204
|
const offBoard = myRow !== null && myRow !== void 0 && myRow.rank === -1;
|
|
8887
9205
|
const isEmpty = segment === "weekly" ? data.weeklyTop.length === 0 : data.allTimeTop.length === 0;
|
|
8888
|
-
return /* @__PURE__ */
|
|
8889
|
-
/* @__PURE__ */
|
|
8890
|
-
/* @__PURE__ */
|
|
9206
|
+
return /* @__PURE__ */ jsxs78("div", { className: "ss-w-lb2", children: [
|
|
9207
|
+
/* @__PURE__ */ jsxs78("div", { className: "ss-w-seg", children: [
|
|
9208
|
+
/* @__PURE__ */ jsx92(
|
|
8891
9209
|
"button",
|
|
8892
9210
|
{
|
|
8893
9211
|
type: "button",
|
|
@@ -8897,7 +9215,7 @@ function Leaderboard({
|
|
|
8897
9215
|
children: ui.leaderboardThisWeek
|
|
8898
9216
|
}
|
|
8899
9217
|
),
|
|
8900
|
-
/* @__PURE__ */
|
|
9218
|
+
/* @__PURE__ */ jsx92(
|
|
8901
9219
|
"button",
|
|
8902
9220
|
{
|
|
8903
9221
|
type: "button",
|
|
@@ -8908,7 +9226,7 @@ function Leaderboard({
|
|
|
8908
9226
|
}
|
|
8909
9227
|
)
|
|
8910
9228
|
] }),
|
|
8911
|
-
isEmpty ? /* @__PURE__ */
|
|
9229
|
+
isEmpty ? /* @__PURE__ */ jsx92(
|
|
8912
9230
|
LeaderboardEmpty,
|
|
8913
9231
|
{
|
|
8914
9232
|
segment,
|
|
@@ -8917,15 +9235,15 @@ function Leaderboard({
|
|
|
8917
9235
|
onPlay,
|
|
8918
9236
|
ui
|
|
8919
9237
|
}
|
|
8920
|
-
) : /* @__PURE__ */
|
|
8921
|
-
/* @__PURE__ */
|
|
9238
|
+
) : /* @__PURE__ */ jsxs78(Fragment20, { children: [
|
|
9239
|
+
/* @__PURE__ */ jsx92("div", { className: "ss-w-lb2-rows", children: segment === "weekly" ? data.weeklyTop.map((row) => /* @__PURE__ */ jsx92(
|
|
8922
9240
|
LeaderboardWeeklyRow,
|
|
8923
9241
|
{
|
|
8924
9242
|
row,
|
|
8925
9243
|
isMe: row.operatorUserId === data.myWeeklyRow?.operatorUserId
|
|
8926
9244
|
},
|
|
8927
9245
|
row.operatorUserId
|
|
8928
|
-
)) : data.allTimeTop.map((row) => /* @__PURE__ */
|
|
9246
|
+
)) : data.allTimeTop.map((row) => /* @__PURE__ */ jsx92(
|
|
8929
9247
|
LeaderboardAllTimeRow,
|
|
8930
9248
|
{
|
|
8931
9249
|
row,
|
|
@@ -8933,18 +9251,18 @@ function Leaderboard({
|
|
|
8933
9251
|
},
|
|
8934
9252
|
row.operatorUserId
|
|
8935
9253
|
)) }),
|
|
8936
|
-
/* @__PURE__ */
|
|
8937
|
-
myRow != null && (offBoard ? /* @__PURE__ */
|
|
8938
|
-
segment === "weekly" && data.myWeeklyRow && /* @__PURE__ */
|
|
8939
|
-
segment === "alltime" && data.myAllTimeRow && /* @__PURE__ */
|
|
9254
|
+
/* @__PURE__ */ jsx92("div", { className: "ss-w-kitline", children: "\u{1F3BD}" }),
|
|
9255
|
+
myRow != null && (offBoard ? /* @__PURE__ */ jsx92("div", { className: "ss-w-lbgap", children: ui.leaderboardOffBoard }) : /* @__PURE__ */ jsxs78("div", { className: "ss-w-lb2-rows", children: [
|
|
9256
|
+
segment === "weekly" && data.myWeeklyRow && /* @__PURE__ */ jsx92(LeaderboardWeeklyRow, { row: data.myWeeklyRow, isMe: true }),
|
|
9257
|
+
segment === "alltime" && data.myAllTimeRow && /* @__PURE__ */ jsx92(LeaderboardAllTimeRow, { row: data.myAllTimeRow, isMe: true })
|
|
8940
9258
|
] })),
|
|
8941
|
-
segment === "alltime" && data.myAllTimeRow && !offBoard && /* @__PURE__ */
|
|
9259
|
+
segment === "alltime" && data.myAllTimeRow && !offBoard && /* @__PURE__ */ jsx92("div", { className: "ss-w-lb2-rows", children: /* @__PURE__ */ jsx92("div", { className: "ss-w-lb2-row", children: /* @__PURE__ */ jsx92("span", { className: "ss-w-lb2-handle", children: formatPoints(data.allTimeTop.reduce((s, r) => s + r.allTimePoints, 0)) }) }) })
|
|
8942
9260
|
] })
|
|
8943
9261
|
] });
|
|
8944
9262
|
}
|
|
8945
9263
|
|
|
8946
9264
|
// src/components/LeaderboardPanel.tsx
|
|
8947
|
-
import { jsx as
|
|
9265
|
+
import { jsx as jsx93 } from "react/jsx-runtime";
|
|
8948
9266
|
var EMPTY_PAYLOAD = {
|
|
8949
9267
|
week: "",
|
|
8950
9268
|
weeklyTop: [],
|
|
@@ -8955,19 +9273,19 @@ var EMPTY_PAYLOAD = {
|
|
|
8955
9273
|
lastWeek: null
|
|
8956
9274
|
};
|
|
8957
9275
|
function LeaderboardPanel({ loggedIn, data, loading, onPlay, ui }) {
|
|
8958
|
-
if (!loggedIn) return /* @__PURE__ */
|
|
8959
|
-
if (data === null && loading) return /* @__PURE__ */
|
|
8960
|
-
return /* @__PURE__ */
|
|
9276
|
+
if (!loggedIn) return /* @__PURE__ */ jsx93(GamesLoginWall, { ui });
|
|
9277
|
+
if (data === null && loading) return /* @__PURE__ */ jsx93("div", { className: "ss-w-mon-list" });
|
|
9278
|
+
return /* @__PURE__ */ jsx93("div", { className: "ss-w-mon-list", children: /* @__PURE__ */ jsx93(Leaderboard, { data: data ?? EMPTY_PAYLOAD, ui, onPlay }) });
|
|
8961
9279
|
}
|
|
8962
9280
|
|
|
8963
9281
|
// src/components/PresetSpeedDial.tsx
|
|
8964
|
-
import { useId as
|
|
8965
|
-
import { jsx as
|
|
9282
|
+
import { useId as useId10 } from "react";
|
|
9283
|
+
import { jsx as jsx94, jsxs as jsxs79 } from "react/jsx-runtime";
|
|
8966
9284
|
function PresetSpeedDial({ expanded, showDot, strings, onToggle, onOpen, rootRef, buttonRef }) {
|
|
8967
|
-
const pillsId =
|
|
9285
|
+
const pillsId = useId10();
|
|
8968
9286
|
const tabIndex = expanded ? 0 : -1;
|
|
8969
|
-
return /* @__PURE__ */
|
|
8970
|
-
/* @__PURE__ */
|
|
9287
|
+
return /* @__PURE__ */ jsxs79("div", { ref: rootRef, className: "ss-w-dial", children: [
|
|
9288
|
+
/* @__PURE__ */ jsxs79(
|
|
8971
9289
|
"button",
|
|
8972
9290
|
{
|
|
8973
9291
|
ref: buttonRef,
|
|
@@ -8978,36 +9296,36 @@ function PresetSpeedDial({ expanded, showDot, strings, onToggle, onOpen, rootRef
|
|
|
8978
9296
|
"aria-label": strings.dialName,
|
|
8979
9297
|
onClick: onToggle,
|
|
8980
9298
|
children: [
|
|
8981
|
-
/* @__PURE__ */
|
|
8982
|
-
/* @__PURE__ */
|
|
8983
|
-
showDot && !expanded ? /* @__PURE__ */
|
|
9299
|
+
/* @__PURE__ */ jsx94("span", { className: "ss-w-dial-icon ss-w-dial-icon--open", children: /* @__PURE__ */ jsx94(SlidersIcon, {}) }),
|
|
9300
|
+
/* @__PURE__ */ jsx94("span", { className: "ss-w-dial-icon ss-w-dial-icon--close", children: /* @__PURE__ */ jsx94(CloseIcon, {}) }),
|
|
9301
|
+
showDot && !expanded ? /* @__PURE__ */ jsx94("span", { className: "ss-w-dial-dot", "aria-hidden": "true" }) : null
|
|
8984
9302
|
]
|
|
8985
9303
|
}
|
|
8986
9304
|
),
|
|
8987
|
-
/* @__PURE__ */
|
|
8988
|
-
/* @__PURE__ */
|
|
8989
|
-
/* @__PURE__ */
|
|
8990
|
-
/* @__PURE__ */
|
|
9305
|
+
/* @__PURE__ */ jsxs79("div", { id: pillsId, className: "ss-w-dial-pills", "data-open": expanded ? "" : void 0, children: [
|
|
9306
|
+
/* @__PURE__ */ jsxs79("button", { type: "button", className: "ss-w-dial-pill", tabIndex, onClick: () => onOpen("numbers"), children: [
|
|
9307
|
+
/* @__PURE__ */ jsx94(SlidersIcon, {}),
|
|
9308
|
+
/* @__PURE__ */ jsx94("span", { className: "ss-w-dial-pill-label", children: strings.setNumbers })
|
|
8991
9309
|
] }),
|
|
8992
|
-
/* @__PURE__ */
|
|
8993
|
-
/* @__PURE__ */
|
|
8994
|
-
/* @__PURE__ */
|
|
9310
|
+
/* @__PURE__ */ jsxs79("button", { type: "button", className: "ss-w-dial-pill", tabIndex, onClick: () => onOpen("combo"), children: [
|
|
9311
|
+
/* @__PURE__ */ jsx94(ComboIcon, {}),
|
|
9312
|
+
/* @__PURE__ */ jsx94("span", { className: "ss-w-dial-pill-label", children: strings.buildCombo })
|
|
8995
9313
|
] })
|
|
8996
9314
|
] })
|
|
8997
9315
|
] });
|
|
8998
9316
|
}
|
|
8999
9317
|
|
|
9000
9318
|
// src/components/PresetTools.tsx
|
|
9001
|
-
import { Fragment as Fragment21, useEffect as
|
|
9002
|
-
import { Fragment as Fragment22, jsx as
|
|
9319
|
+
import { Fragment as Fragment21, useEffect as useEffect26, useId as useId11, useRef as useRef21, useState as useState45 } from "react";
|
|
9320
|
+
import { Fragment as Fragment22, jsx as jsx95, jsxs as jsxs80 } from "react/jsx-runtime";
|
|
9003
9321
|
var FOCUSABLE = 'button:not([disabled]), [href], input:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
|
|
9004
9322
|
function PresetToolModal({ title, closeLabel, onClose, children, footer }) {
|
|
9005
|
-
const dialogRef =
|
|
9006
|
-
const titleId =
|
|
9007
|
-
|
|
9323
|
+
const dialogRef = useRef21(null);
|
|
9324
|
+
const titleId = useId11();
|
|
9325
|
+
useEffect26(() => {
|
|
9008
9326
|
dialogRef.current?.focus();
|
|
9009
9327
|
}, []);
|
|
9010
|
-
|
|
9328
|
+
useEffect26(() => {
|
|
9011
9329
|
const onKey = (e) => {
|
|
9012
9330
|
if (e.key !== "Escape") return;
|
|
9013
9331
|
e.stopPropagation();
|
|
@@ -9037,79 +9355,79 @@ function PresetToolModal({ title, closeLabel, onClose, children, footer }) {
|
|
|
9037
9355
|
first.focus();
|
|
9038
9356
|
}
|
|
9039
9357
|
};
|
|
9040
|
-
return /* @__PURE__ */
|
|
9041
|
-
/* @__PURE__ */
|
|
9042
|
-
/* @__PURE__ */
|
|
9043
|
-
/* @__PURE__ */
|
|
9358
|
+
return /* @__PURE__ */ jsx95("div", { className: "ss-w-tool-backdrop", children: /* @__PURE__ */ jsxs80("div", { ref: dialogRef, className: "ss-w-tool", role: "dialog", "aria-modal": "true", "aria-labelledby": titleId, tabIndex: -1, onKeyDown: trapTab, children: [
|
|
9359
|
+
/* @__PURE__ */ jsxs80("div", { className: "ss-w-tool-head", children: [
|
|
9360
|
+
/* @__PURE__ */ jsx95("h2", { id: titleId, className: "ss-w-tool-title", children: title }),
|
|
9361
|
+
/* @__PURE__ */ jsx95("button", { type: "button", className: "ss-w-tool-close", "aria-label": closeLabel, onClick: onClose, children: /* @__PURE__ */ jsx95(CloseIcon, {}) })
|
|
9044
9362
|
] }),
|
|
9045
|
-
/* @__PURE__ */
|
|
9046
|
-
footer ? /* @__PURE__ */
|
|
9363
|
+
/* @__PURE__ */ jsx95("div", { className: "ss-w-tool-body", children }),
|
|
9364
|
+
footer ? /* @__PURE__ */ jsx95("div", { className: "ss-w-tool-foot", children: footer }) : null
|
|
9047
9365
|
] }) });
|
|
9048
9366
|
}
|
|
9049
9367
|
function fillTemplate(template, slots) {
|
|
9050
9368
|
return template.split(/(\{[a-z]+\})/).filter((part) => part !== "").map((part, i) => {
|
|
9051
9369
|
const key = /^\{([a-z]+)\}$/.exec(part)?.[1];
|
|
9052
|
-
return /* @__PURE__ */
|
|
9370
|
+
return /* @__PURE__ */ jsx95(Fragment21, { children: key !== void 0 && key in slots ? slots[key] : part }, i);
|
|
9053
9371
|
});
|
|
9054
9372
|
}
|
|
9055
9373
|
function NumberSelect({ current, choices: choices2, label, notToday, lockEmpty = true, onChoose }) {
|
|
9056
9374
|
const selected = Math.max(0, choices2.findIndex((c) => c.text === current));
|
|
9057
|
-
return /* @__PURE__ */
|
|
9058
|
-
/* @__PURE__ */
|
|
9059
|
-
/* @__PURE__ */
|
|
9375
|
+
return /* @__PURE__ */ jsxs80("span", { className: "ss-w-tool-num", children: [
|
|
9376
|
+
/* @__PURE__ */ jsx95("span", { className: "ss-w-tool-num-size", "aria-hidden": "true", children: current }),
|
|
9377
|
+
/* @__PURE__ */ jsx95("select", { className: "ss-w-tool-num-select", "aria-label": label, value: String(selected), onChange: (e) => {
|
|
9060
9378
|
const c = choices2[Number(e.target.value)];
|
|
9061
9379
|
if (c) onChoose(c.value);
|
|
9062
|
-
}, children: choices2.map((c, i) => /* @__PURE__ */
|
|
9380
|
+
}, children: choices2.map((c, i) => /* @__PURE__ */ jsx95("option", { value: String(i), disabled: lockEmpty && !c.available && i !== selected, children: c.available ? c.text : `${c.text}${notToday}` }, i)) })
|
|
9063
9381
|
] });
|
|
9064
9382
|
}
|
|
9065
9383
|
function ChoiceSelect({ currentIdx, sizeLabels, optionLabels, label, onChoose }) {
|
|
9066
9384
|
const sizeText = sizeLabels[currentIdx] ?? "";
|
|
9067
|
-
return /* @__PURE__ */
|
|
9068
|
-
/* @__PURE__ */
|
|
9069
|
-
/* @__PURE__ */
|
|
9385
|
+
return /* @__PURE__ */ jsxs80("span", { className: "ss-w-tool-num", children: [
|
|
9386
|
+
/* @__PURE__ */ jsx95("span", { className: "ss-w-tool-num-size", "aria-hidden": "true", children: sizeText }),
|
|
9387
|
+
/* @__PURE__ */ jsx95("select", { className: "ss-w-tool-num-select", "aria-label": label, value: String(currentIdx), onChange: (e) => onChoose(Number(e.target.value)), children: optionLabels.map((opt, i) => /* @__PURE__ */ jsx95("option", { value: String(i), children: opt }, i)) })
|
|
9070
9388
|
] });
|
|
9071
9389
|
}
|
|
9072
9390
|
function SendButton({ label, display, disabled, onClick }) {
|
|
9073
|
-
return /* @__PURE__ */
|
|
9391
|
+
return /* @__PURE__ */ jsx95("button", { type: "button", className: "ss-w-tool-send", "aria-label": `${label}: ${display}`, disabled, onClick, children: label });
|
|
9074
9392
|
}
|
|
9075
9393
|
function PickList({ picks, formatKickoff }) {
|
|
9076
|
-
return /* @__PURE__ */
|
|
9077
|
-
/* @__PURE__ */
|
|
9394
|
+
return /* @__PURE__ */ jsx95("ul", { className: "ss-w-tool-picks", role: "list", children: picks.map((p) => /* @__PURE__ */ jsxs80("li", { className: "ss-w-tool-pick", children: [
|
|
9395
|
+
/* @__PURE__ */ jsxs80("span", { className: "ss-w-tool-pick-match", children: [
|
|
9078
9396
|
p.homeTeamName,
|
|
9079
9397
|
" \u2013 ",
|
|
9080
9398
|
p.awayTeamName
|
|
9081
9399
|
] }),
|
|
9082
|
-
/* @__PURE__ */
|
|
9400
|
+
/* @__PURE__ */ jsxs80("span", { className: "ss-w-tool-pick-sel", children: [
|
|
9083
9401
|
p.marketLabel,
|
|
9084
9402
|
": ",
|
|
9085
9403
|
p.selectionLabel,
|
|
9086
9404
|
p.line ? ` ${p.line}` : ""
|
|
9087
9405
|
] }),
|
|
9088
|
-
/* @__PURE__ */
|
|
9089
|
-
/* @__PURE__ */
|
|
9406
|
+
/* @__PURE__ */ jsx95("span", { className: "ss-w-tool-pick-kick", children: formatKickoff(p.kickoffUtc) }),
|
|
9407
|
+
/* @__PURE__ */ jsx95("span", { className: "ss-w-tool-pick-price", children: p.price.toFixed(2) })
|
|
9090
9408
|
] }, p.matchOddsId)) });
|
|
9091
9409
|
}
|
|
9092
9410
|
function ComboPreview({ cell, formatKickoff }) {
|
|
9093
|
-
return /* @__PURE__ */
|
|
9094
|
-
/* @__PURE__ */
|
|
9095
|
-
/* @__PURE__ */
|
|
9411
|
+
return /* @__PURE__ */ jsxs80(Fragment22, { children: [
|
|
9412
|
+
/* @__PURE__ */ jsx95(PickList, { picks: cell.combo.legs, formatKickoff }),
|
|
9413
|
+
/* @__PURE__ */ jsx95("div", { className: "ss-w-tool-math", children: cell.combo.multiplication })
|
|
9096
9414
|
] });
|
|
9097
9415
|
}
|
|
9098
9416
|
function Unavailable({ text }) {
|
|
9099
|
-
return /* @__PURE__ */
|
|
9417
|
+
return /* @__PURE__ */ jsx95("p", { className: "ss-w-tool-unavailable", children: text });
|
|
9100
9418
|
}
|
|
9101
9419
|
function AskRow({ icon, ask, ready, send }) {
|
|
9102
|
-
return /* @__PURE__ */
|
|
9103
|
-
/* @__PURE__ */
|
|
9104
|
-
/* @__PURE__ */
|
|
9105
|
-
/* @__PURE__ */
|
|
9106
|
-
ready ? /* @__PURE__ */
|
|
9420
|
+
return /* @__PURE__ */ jsxs80("section", { className: "ss-w-tool-row ss-w-tool-row--ask", children: [
|
|
9421
|
+
/* @__PURE__ */ jsx95("span", { className: "ss-w-tool-icon", "aria-hidden": "true", children: icon }),
|
|
9422
|
+
/* @__PURE__ */ jsxs80("div", { className: "ss-w-tool-main", children: [
|
|
9423
|
+
/* @__PURE__ */ jsx95("p", { className: "ss-w-tool-ask", children: ask }),
|
|
9424
|
+
ready ? /* @__PURE__ */ jsx95("span", { className: "ss-w-tool-ready", children: ready }) : null
|
|
9107
9425
|
] }),
|
|
9108
9426
|
send
|
|
9109
9427
|
] });
|
|
9110
9428
|
}
|
|
9111
9429
|
function RoundSend({ label, display, disabled, onClick }) {
|
|
9112
|
-
return /* @__PURE__ */
|
|
9430
|
+
return /* @__PURE__ */ jsx95("button", { type: "button", className: "ss-w-tool-go", "aria-label": `${label}: ${display}`, disabled, onClick, children: /* @__PURE__ */ jsx95(SendIcon, {}) });
|
|
9113
9431
|
}
|
|
9114
9432
|
var BIG_COMBO = { total: 50, legs: 6 };
|
|
9115
9433
|
function SetNumbersTool({ grid, strings, streaming, onSend, onClose }) {
|
|
@@ -9118,15 +9436,15 @@ function SetNumbersTool({ grid, strings, streaming, onSend, onClose }) {
|
|
|
9118
9436
|
const totals = comboTotals(grid);
|
|
9119
9437
|
const legChoices = comboLegChoices(grid);
|
|
9120
9438
|
const count = FIXED_SINGLES_COUNT;
|
|
9121
|
-
const [maxPrice, setMaxPrice] =
|
|
9122
|
-
const [minPrice, setMinPrice] =
|
|
9123
|
-
const [start] =
|
|
9124
|
-
const [total, setTotal] =
|
|
9125
|
-
const [legs, setLegs] =
|
|
9126
|
-
const [bigStart] =
|
|
9127
|
-
const [bigTotal, setBigTotal] =
|
|
9128
|
-
const [bigLegs, setBigLegs] =
|
|
9129
|
-
const [announcement, setAnnouncement] =
|
|
9439
|
+
const [maxPrice, setMaxPrice] = useState45(() => startSingles(grid.singles, limits, START.maxPrice, count));
|
|
9440
|
+
const [minPrice, setMinPrice] = useState45(() => startSingles(grid.singlesFrom, floors, START.minPrice, count));
|
|
9441
|
+
const [start] = useState45(() => startCombo(grid, totals, legChoices, START.comboTotal, START.comboLegs));
|
|
9442
|
+
const [total, setTotal] = useState45(start.total);
|
|
9443
|
+
const [legs, setLegs] = useState45(start.legs);
|
|
9444
|
+
const [bigStart] = useState45(() => startCombo(grid, totals, legChoices, BIG_COMBO.total, BIG_COMBO.legs));
|
|
9445
|
+
const [bigTotal, setBigTotal] = useState45(bigStart.total);
|
|
9446
|
+
const [bigLegs, setBigLegs] = useState45(bigStart.legs);
|
|
9447
|
+
const [announcement, setAnnouncement] = useState45("");
|
|
9130
9448
|
const maxCell = findSingles(grid.singles, maxPrice, count);
|
|
9131
9449
|
const minCell = findSingles(grid.singlesFrom, minPrice, count);
|
|
9132
9450
|
const comboCell = findCombo(grid, total, legs);
|
|
@@ -9170,95 +9488,95 @@ function SetNumbersTool({ grid, strings, streaming, onSend, onClose }) {
|
|
|
9170
9488
|
const totalChoices = totals.map((v) => ({ value: v, text: v.toFixed(1), available: legChoices.some((n) => !!findCombo(grid, v, n)) }));
|
|
9171
9489
|
const legChoicesFor = (t) => legChoices.map((n) => ({ value: n, text: String(n), available: !!findCombo(grid, t, n) }));
|
|
9172
9490
|
const markets = grid.markets ?? [];
|
|
9173
|
-
const [marketIdx, setMarketIdx] =
|
|
9491
|
+
const [marketIdx, setMarketIdx] = useState45(0);
|
|
9174
9492
|
const marketCell = markets[marketIdx] ?? null;
|
|
9175
9493
|
const marketLabels = markets.map((c) => strings.marketShort(c.marketDeveloperName, c.marketLabel, c.selectionLabel ?? null));
|
|
9176
9494
|
const singlesReady = (cell) => cell ? strings.readyCount(cell.picks.length) : strings.unavailable;
|
|
9177
9495
|
const comboReady = (cell) => cell ? strings.readyAt(cell.combo.total) : strings.unavailable;
|
|
9178
|
-
return /* @__PURE__ */
|
|
9179
|
-
/* @__PURE__ */
|
|
9496
|
+
return /* @__PURE__ */ jsxs80(PresetToolModal, { title: strings.setNumbers, closeLabel: strings.close, onClose, children: [
|
|
9497
|
+
/* @__PURE__ */ jsx95(
|
|
9180
9498
|
AskRow,
|
|
9181
9499
|
{
|
|
9182
9500
|
icon: "\u{1F3AF}",
|
|
9183
9501
|
ask: fillTemplate(strings.maxPriceRow, {
|
|
9184
9502
|
count: String(count),
|
|
9185
|
-
price: /* @__PURE__ */
|
|
9503
|
+
price: /* @__PURE__ */ jsx95(NumberSelect, { current: maxPrice.toFixed(2), choices: maxChoices, label: strings.maxPriceName, notToday: strings.notToday, onChoose: chooseMax })
|
|
9186
9504
|
}),
|
|
9187
9505
|
ready: singlesReady(maxCell),
|
|
9188
|
-
send: /* @__PURE__ */
|
|
9506
|
+
send: /* @__PURE__ */ jsx95(RoundSend, { label: strings.send, display: strings.maxPriceDisplay(count, maxPrice), disabled: !maxCell || streaming, onClick: () => {
|
|
9189
9507
|
if (maxCell) onSend(maxPriceAsk(maxCell, strings));
|
|
9190
9508
|
} })
|
|
9191
9509
|
}
|
|
9192
9510
|
),
|
|
9193
|
-
/* @__PURE__ */
|
|
9511
|
+
/* @__PURE__ */ jsx95(
|
|
9194
9512
|
AskRow,
|
|
9195
9513
|
{
|
|
9196
9514
|
icon: "\u{1F4C8}",
|
|
9197
9515
|
ask: fillTemplate(strings.minPriceRow, {
|
|
9198
9516
|
count: String(count),
|
|
9199
|
-
price: /* @__PURE__ */
|
|
9517
|
+
price: /* @__PURE__ */ jsx95(NumberSelect, { current: minPrice.toFixed(2), choices: minChoices, label: strings.minPriceName, notToday: strings.notToday, onChoose: chooseMin })
|
|
9200
9518
|
}),
|
|
9201
9519
|
ready: singlesReady(minCell),
|
|
9202
|
-
send: /* @__PURE__ */
|
|
9520
|
+
send: /* @__PURE__ */ jsx95(RoundSend, { label: strings.send, display: strings.minPriceDisplay(count, minPrice), disabled: !minCell || streaming, onClick: () => {
|
|
9203
9521
|
if (minCell) onSend(minPriceAsk(minCell, strings));
|
|
9204
9522
|
} })
|
|
9205
9523
|
}
|
|
9206
9524
|
),
|
|
9207
|
-
/* @__PURE__ */
|
|
9525
|
+
/* @__PURE__ */ jsx95(
|
|
9208
9526
|
AskRow,
|
|
9209
9527
|
{
|
|
9210
9528
|
icon: "\u2728",
|
|
9211
9529
|
ask: fillTemplate(strings.comboRow, {
|
|
9212
|
-
legs: /* @__PURE__ */
|
|
9213
|
-
total: /* @__PURE__ */
|
|
9530
|
+
legs: /* @__PURE__ */ jsx95(NumberSelect, { current: String(legs), choices: legChoicesFor(total), label: strings.matchesLabel, notToday: strings.notToday, lockEmpty: false, onChoose: chooseLegs }),
|
|
9531
|
+
total: /* @__PURE__ */ jsx95(NumberSelect, { current: total.toFixed(1), choices: totalChoices, label: strings.totalLabel, notToday: strings.notToday, onChoose: chooseTotal })
|
|
9214
9532
|
}),
|
|
9215
9533
|
ready: comboReady(comboCell),
|
|
9216
|
-
send: /* @__PURE__ */
|
|
9534
|
+
send: /* @__PURE__ */ jsx95(RoundSend, { label: strings.send, display: strings.comboDisplay(legs, total), disabled: !comboCell || streaming, onClick: () => {
|
|
9217
9535
|
if (comboCell) onSend(comboAsk(comboCell, strings));
|
|
9218
9536
|
} })
|
|
9219
9537
|
}
|
|
9220
9538
|
),
|
|
9221
|
-
/* @__PURE__ */
|
|
9539
|
+
/* @__PURE__ */ jsx95(
|
|
9222
9540
|
AskRow,
|
|
9223
9541
|
{
|
|
9224
9542
|
icon: "\u{1F3C6}",
|
|
9225
9543
|
ask: fillTemplate(strings.bigComboRow, {
|
|
9226
|
-
legs: /* @__PURE__ */
|
|
9227
|
-
total: /* @__PURE__ */
|
|
9544
|
+
legs: /* @__PURE__ */ jsx95(NumberSelect, { current: String(bigLegs), choices: legChoicesFor(bigTotal), label: strings.matchesLabel, notToday: strings.notToday, lockEmpty: false, onChoose: chooseBigLegs }),
|
|
9545
|
+
total: /* @__PURE__ */ jsx95(NumberSelect, { current: bigTotal.toFixed(1), choices: totalChoices, label: strings.totalLabel, notToday: strings.notToday, onChoose: chooseBigTotal })
|
|
9228
9546
|
}),
|
|
9229
9547
|
ready: comboReady(bigCell),
|
|
9230
|
-
send: /* @__PURE__ */
|
|
9548
|
+
send: /* @__PURE__ */ jsx95(RoundSend, { label: strings.send, display: strings.comboDisplay(bigLegs, bigTotal), disabled: !bigCell || streaming, onClick: () => {
|
|
9231
9549
|
if (bigCell) onSend(comboAsk(bigCell, strings));
|
|
9232
9550
|
} })
|
|
9233
9551
|
}
|
|
9234
9552
|
),
|
|
9235
|
-
markets.length > 0 && /* @__PURE__ */
|
|
9553
|
+
markets.length > 0 && /* @__PURE__ */ jsx95(
|
|
9236
9554
|
AskRow,
|
|
9237
9555
|
{
|
|
9238
9556
|
icon: "\u26BD",
|
|
9239
9557
|
ask: fillTemplate(strings.marketRow, {
|
|
9240
|
-
market: /* @__PURE__ */
|
|
9558
|
+
market: /* @__PURE__ */ jsx95(ChoiceSelect, { currentIdx: marketIdx, sizeLabels: marketLabels, optionLabels: marketLabels, label: strings.marketName, onChoose: chooseMarket })
|
|
9241
9559
|
}),
|
|
9242
9560
|
ready: marketCell ? strings.readyCount(marketCell.count) : null,
|
|
9243
|
-
send: /* @__PURE__ */
|
|
9561
|
+
send: /* @__PURE__ */ jsx95(RoundSend, { label: strings.send, display: marketCell ? marketDisplay(marketCell, strings) : "", disabled: !marketCell || streaming, onClick: () => {
|
|
9244
9562
|
if (marketCell) onSend(marketAsk(marketCell, strings));
|
|
9245
9563
|
} })
|
|
9246
9564
|
}
|
|
9247
9565
|
),
|
|
9248
|
-
/* @__PURE__ */
|
|
9566
|
+
/* @__PURE__ */ jsx95("p", { className: "ss-w-vh", "aria-live": "polite", children: announcement })
|
|
9249
9567
|
] });
|
|
9250
9568
|
}
|
|
9251
9569
|
function BuildComboTool({ grid, strings, streaming, formatKickoff, initialTotal, initialLegs, onSend, onClose }) {
|
|
9252
9570
|
const totals = comboTotals(grid);
|
|
9253
9571
|
const legChoices = comboLegChoices(grid);
|
|
9254
|
-
const [start] =
|
|
9255
|
-
const [total, setTotal] =
|
|
9256
|
-
const [legs, setLegs] =
|
|
9572
|
+
const [start] = useState45(() => initialTotal === void 0 ? startCombo(grid, totals, legChoices, START.comboTotal, START.comboLegs) : null);
|
|
9573
|
+
const [total, setTotal] = useState45(() => initialTotal !== void 0 ? nearest(totals, initialTotal) : start.total);
|
|
9574
|
+
const [legs, setLegs] = useState45(() => {
|
|
9257
9575
|
if (initialTotal === void 0) return initialLegs !== void 0 ? clampLegs(legChoices, initialLegs) : start.legs;
|
|
9258
9576
|
const from = initialLegs !== void 0 ? clampLegs(legChoices, initialLegs) : startValue(legChoices, START.comboLegs);
|
|
9259
9577
|
return legsForTotal(grid, nearest(totals, initialTotal), from);
|
|
9260
9578
|
});
|
|
9261
|
-
const [announcement, setAnnouncement] =
|
|
9579
|
+
const [announcement, setAnnouncement] = useState45("");
|
|
9262
9580
|
const cell = findCombo(grid, total, legs);
|
|
9263
9581
|
const minLegs = legChoices[0] ?? legs;
|
|
9264
9582
|
const maxLegs = legChoices[legChoices.length - 1] ?? legs;
|
|
@@ -9269,29 +9587,29 @@ function BuildComboTool({ grid, strings, streaming, formatKickoff, initialTotal,
|
|
|
9269
9587
|
const d = strings.comboDisplay(nextLegs, nextTotal);
|
|
9270
9588
|
setAnnouncement(findCombo(grid, nextTotal, nextLegs) ? d : `${d}. ${strings.unavailable}`);
|
|
9271
9589
|
};
|
|
9272
|
-
const footer = /* @__PURE__ */
|
|
9590
|
+
const footer = /* @__PURE__ */ jsx95(SendButton, { label: strings.send, display, disabled: !cell || streaming, onClick: () => {
|
|
9273
9591
|
if (cell) onSend(comboAsk(cell, strings));
|
|
9274
9592
|
} });
|
|
9275
|
-
return /* @__PURE__ */
|
|
9276
|
-
/* @__PURE__ */
|
|
9277
|
-
/* @__PURE__ */
|
|
9278
|
-
/* @__PURE__ */
|
|
9593
|
+
return /* @__PURE__ */ jsxs80(PresetToolModal, { title: strings.buildCombo, closeLabel: strings.close, onClose, footer, children: [
|
|
9594
|
+
/* @__PURE__ */ jsxs80("div", { className: "ss-w-tool-section", role: "group", "aria-label": strings.totalLabel, children: [
|
|
9595
|
+
/* @__PURE__ */ jsx95("span", { className: "ss-w-tool-label", "aria-hidden": "true", children: strings.totalLabel }),
|
|
9596
|
+
/* @__PURE__ */ jsx95("div", { className: "ss-w-tool-chips", children: totals.map((t) => /* @__PURE__ */ jsx95("button", { type: "button", className: "ss-w-tool-chip", "aria-pressed": samePrice(t, total), onClick: () => choose(t, samePrice(t, total) ? legs : legsForTotal(grid, t, legs)), children: t.toFixed(1) }, t)) })
|
|
9279
9597
|
] }),
|
|
9280
|
-
/* @__PURE__ */
|
|
9281
|
-
/* @__PURE__ */
|
|
9282
|
-
/* @__PURE__ */
|
|
9283
|
-
/* @__PURE__ */
|
|
9284
|
-
/* @__PURE__ */
|
|
9285
|
-
/* @__PURE__ */
|
|
9598
|
+
/* @__PURE__ */ jsxs80("div", { className: "ss-w-tool-section", role: "group", "aria-label": strings.matchesLabel, children: [
|
|
9599
|
+
/* @__PURE__ */ jsx95("span", { className: "ss-w-tool-label", "aria-hidden": "true", children: strings.matchesLabel }),
|
|
9600
|
+
/* @__PURE__ */ jsxs80("div", { className: "ss-w-tool-stepper", children: [
|
|
9601
|
+
/* @__PURE__ */ jsx95("button", { type: "button", className: "ss-w-tool-step", "aria-label": strings.fewerMatches, disabled: legs <= minLegs, onClick: () => choose(total, legs - 1), children: "\u2212" }),
|
|
9602
|
+
/* @__PURE__ */ jsx95("span", { className: "ss-w-tool-count", children: legs }),
|
|
9603
|
+
/* @__PURE__ */ jsx95("button", { type: "button", className: "ss-w-tool-step", "aria-label": strings.moreMatches, disabled: legs >= maxLegs, onClick: () => choose(total, legs + 1), children: "+" })
|
|
9286
9604
|
] })
|
|
9287
9605
|
] }),
|
|
9288
|
-
cell ? /* @__PURE__ */
|
|
9289
|
-
/* @__PURE__ */
|
|
9606
|
+
cell ? /* @__PURE__ */ jsx95(ComboPreview, { cell, formatKickoff }) : /* @__PURE__ */ jsx95(Unavailable, { text: strings.unavailable }),
|
|
9607
|
+
/* @__PURE__ */ jsx95("p", { className: "ss-w-vh", "aria-live": "polite", children: announcement })
|
|
9290
9608
|
] });
|
|
9291
9609
|
}
|
|
9292
9610
|
|
|
9293
9611
|
// src/usePresetDial.ts
|
|
9294
|
-
import { useCallback as
|
|
9612
|
+
import { useCallback as useCallback15, useEffect as useEffect27, useRef as useRef22, useState as useState46 } from "react";
|
|
9295
9613
|
function sendInFlight(messages, isStreaming) {
|
|
9296
9614
|
const last = messages[messages.length - 1];
|
|
9297
9615
|
return isStreaming && !!last && last.role === "assistant" && !last.done && !last.isGreeting;
|
|
@@ -9305,25 +9623,25 @@ function lastUserId(messages) {
|
|
|
9305
9623
|
}
|
|
9306
9624
|
var SCROLL_KEYS = /* @__PURE__ */ new Set(["ArrowUp", "ArrowDown", "PageUp", "PageDown", "Home", "End", " "]);
|
|
9307
9625
|
function usePresetDial({ layerRef, dialRef, dialButtonRef, messages, isStreaming, activeTab }) {
|
|
9308
|
-
const [expanded, setExpanded] =
|
|
9309
|
-
const fold =
|
|
9310
|
-
const toggle =
|
|
9626
|
+
const [expanded, setExpanded] = useState46(() => !sendInFlight(messages, isStreaming));
|
|
9627
|
+
const fold = useCallback15(() => setExpanded(false), []);
|
|
9628
|
+
const toggle = useCallback15(() => setExpanded((e) => !e), []);
|
|
9311
9629
|
const currentUserId = lastUserId(messages);
|
|
9312
|
-
const userIdRef =
|
|
9313
|
-
|
|
9630
|
+
const userIdRef = useRef22(currentUserId);
|
|
9631
|
+
useEffect27(() => {
|
|
9314
9632
|
if (currentUserId === userIdRef.current) return;
|
|
9315
9633
|
userIdRef.current = currentUserId;
|
|
9316
9634
|
setExpanded(false);
|
|
9317
9635
|
}, [currentUserId]);
|
|
9318
|
-
const tabRef =
|
|
9319
|
-
|
|
9636
|
+
const tabRef = useRef22(activeTab);
|
|
9637
|
+
useEffect27(() => {
|
|
9320
9638
|
if (activeTab === tabRef.current) return;
|
|
9321
9639
|
tabRef.current = activeTab;
|
|
9322
9640
|
setExpanded(false);
|
|
9323
9641
|
}, [activeTab]);
|
|
9324
|
-
const expandedRef =
|
|
9642
|
+
const expandedRef = useRef22(expanded);
|
|
9325
9643
|
expandedRef.current = expanded;
|
|
9326
|
-
|
|
9644
|
+
useEffect27(() => {
|
|
9327
9645
|
const onEscape = (e) => {
|
|
9328
9646
|
const dial = dialRef.current;
|
|
9329
9647
|
if (e.key !== "Escape" || !dial || !e.composedPath().includes(dial)) return;
|
|
@@ -9336,7 +9654,7 @@ function usePresetDial({ layerRef, dialRef, dialButtonRef, messages, isStreaming
|
|
|
9336
9654
|
window.addEventListener("keydown", onEscape, true);
|
|
9337
9655
|
return () => window.removeEventListener("keydown", onEscape, true);
|
|
9338
9656
|
}, [dialRef, dialButtonRef]);
|
|
9339
|
-
|
|
9657
|
+
useEffect27(() => {
|
|
9340
9658
|
if (!expanded) return;
|
|
9341
9659
|
const layer = layerRef.current;
|
|
9342
9660
|
const inDial = (e) => {
|
|
@@ -9388,11 +9706,11 @@ function markToolSeen() {
|
|
|
9388
9706
|
}
|
|
9389
9707
|
|
|
9390
9708
|
// src/components/ChatPanel.tsx
|
|
9391
|
-
import { Fragment as Fragment23, jsx as
|
|
9709
|
+
import { Fragment as Fragment23, jsx as jsx96, jsxs as jsxs81 } from "react/jsx-runtime";
|
|
9392
9710
|
var FULLSCREEN_QUERY = "(max-width: 639px)";
|
|
9393
9711
|
function useIsModal() {
|
|
9394
|
-
const [modal, setModal] =
|
|
9395
|
-
|
|
9712
|
+
const [modal, setModal] = useState47(false);
|
|
9713
|
+
useEffect28(() => {
|
|
9396
9714
|
if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
|
|
9397
9715
|
const mql = window.matchMedia(FULLSCREEN_QUERY);
|
|
9398
9716
|
const sync = () => setModal(mql.matches);
|
|
@@ -9406,7 +9724,7 @@ var HIDDEN_LAYER_STYLE = { position: "absolute", inset: 0, visibility: "hidden",
|
|
|
9406
9724
|
function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, gamesResult, leaderboardResult, loggedIn, conversation, presetGrid }) {
|
|
9407
9725
|
const { state, close, stop, send, reset } = controller;
|
|
9408
9726
|
const isModal = useIsModal();
|
|
9409
|
-
|
|
9727
|
+
useEffect28(() => {
|
|
9410
9728
|
const onKey = (e) => {
|
|
9411
9729
|
if (e.key === "Escape") close();
|
|
9412
9730
|
};
|
|
@@ -9422,19 +9740,19 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
|
|
|
9422
9740
|
monitor?.setActiveTab("chat");
|
|
9423
9741
|
send(text, { grounding });
|
|
9424
9742
|
};
|
|
9425
|
-
|
|
9743
|
+
useEffect28(() => {
|
|
9426
9744
|
if (monitor && monitor.activeTab !== "chat" && state.isStreaming) monitor.markChatActivity();
|
|
9427
9745
|
}, [monitor, state.isStreaming, state.messages.length]);
|
|
9428
9746
|
const onChatTab = !monitor || monitor.activeTab === "chat";
|
|
9429
|
-
const layerRef =
|
|
9430
|
-
const dialRef =
|
|
9431
|
-
const dialButtonRef =
|
|
9432
|
-
const inputRef =
|
|
9433
|
-
const limitRef =
|
|
9434
|
-
const typedSendRef =
|
|
9435
|
-
const focusAfterCloseRef =
|
|
9436
|
-
const [tool, setTool] =
|
|
9437
|
-
const [toolSeen, setToolSeen] =
|
|
9747
|
+
const layerRef = useRef23(null);
|
|
9748
|
+
const dialRef = useRef23(null);
|
|
9749
|
+
const dialButtonRef = useRef23(null);
|
|
9750
|
+
const inputRef = useRef23(null);
|
|
9751
|
+
const limitRef = useRef23(null);
|
|
9752
|
+
const typedSendRef = useRef23(false);
|
|
9753
|
+
const focusAfterCloseRef = useRef23(null);
|
|
9754
|
+
const [tool, setTool] = useState47(null);
|
|
9755
|
+
const [toolSeen, setToolSeen] = useState47(readToolSeen);
|
|
9438
9756
|
const dial = usePresetDial({
|
|
9439
9757
|
layerRef,
|
|
9440
9758
|
dialRef,
|
|
@@ -9446,53 +9764,53 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
|
|
|
9446
9764
|
const { fold } = dial;
|
|
9447
9765
|
const paused = isPaused(state.limit);
|
|
9448
9766
|
const showDial = !!presetGrid && onChatTab && !tool && !paused;
|
|
9449
|
-
|
|
9767
|
+
useEffect28(() => {
|
|
9450
9768
|
if (paused) setTool(null);
|
|
9451
9769
|
}, [paused]);
|
|
9452
|
-
|
|
9770
|
+
useEffect28(() => {
|
|
9453
9771
|
if (!paused) return;
|
|
9454
9772
|
if (typedSendRef.current) limitRef.current?.focus();
|
|
9455
9773
|
typedSendRef.current = false;
|
|
9456
9774
|
}, [paused]);
|
|
9457
|
-
const openTool =
|
|
9775
|
+
const openTool = useCallback16((next) => {
|
|
9458
9776
|
fold();
|
|
9459
9777
|
markToolSeen();
|
|
9460
9778
|
setToolSeen(true);
|
|
9461
9779
|
setTool(next);
|
|
9462
9780
|
}, [fold]);
|
|
9463
|
-
const onPill =
|
|
9464
|
-
const toolsValue =
|
|
9781
|
+
const onPill = useCallback16((kind) => openTool(kind === "numbers" ? { kind: "numbers" } : { kind: "combo" }), [openTool]);
|
|
9782
|
+
const toolsValue = useMemo5(
|
|
9465
9783
|
() => presetGrid && !paused ? { openBuilder: (total, legs) => openTool({ kind: "combo", total, legs }), changeLabel: ui.presets.changeCombo } : null,
|
|
9466
9784
|
[presetGrid, paused, openTool, ui.presets.changeCombo]
|
|
9467
9785
|
);
|
|
9468
|
-
const closeTool =
|
|
9786
|
+
const closeTool = useCallback16(() => {
|
|
9469
9787
|
focusAfterCloseRef.current = "dial";
|
|
9470
9788
|
setTool(null);
|
|
9471
9789
|
}, []);
|
|
9472
|
-
const sendAsk =
|
|
9790
|
+
const sendAsk = useCallback16((ask) => {
|
|
9473
9791
|
focusAfterCloseRef.current = "composer";
|
|
9474
9792
|
setTool(null);
|
|
9475
9793
|
monitor?.setActiveTab("chat");
|
|
9476
9794
|
send(ask.message, { displayText: ask.displayText, preset: ask.preset });
|
|
9477
9795
|
}, [monitor, send]);
|
|
9478
|
-
const formatKickoff =
|
|
9796
|
+
const formatKickoff = useCallback16((kickoffUtc) => {
|
|
9479
9797
|
const k = ui.bettingKickoff(kickoffUtc);
|
|
9480
9798
|
return `${k.dayLabel} ${k.time}`;
|
|
9481
9799
|
}, [ui]);
|
|
9482
|
-
|
|
9800
|
+
useEffect28(() => {
|
|
9483
9801
|
if (tool) return;
|
|
9484
9802
|
const target = focusAfterCloseRef.current;
|
|
9485
9803
|
focusAfterCloseRef.current = null;
|
|
9486
9804
|
if (target === "dial") dialButtonRef.current?.focus();
|
|
9487
9805
|
else if (target === "composer") inputRef.current?.focus();
|
|
9488
9806
|
}, [tool]);
|
|
9489
|
-
|
|
9807
|
+
useEffect28(() => {
|
|
9490
9808
|
if (!tool || onChatTab && presetGrid) return;
|
|
9491
9809
|
focusAfterCloseRef.current = "composer";
|
|
9492
9810
|
setTool(null);
|
|
9493
9811
|
}, [tool, onChatTab, presetGrid]);
|
|
9494
|
-
return /* @__PURE__ */
|
|
9495
|
-
/* @__PURE__ */
|
|
9812
|
+
return /* @__PURE__ */ jsxs81("div", { className: "ss-w-panel", role: "dialog", "aria-modal": isModal, "aria-label": ui.chatDialogLabel, children: [
|
|
9813
|
+
/* @__PURE__ */ jsx96(
|
|
9496
9814
|
ChatHeader,
|
|
9497
9815
|
{
|
|
9498
9816
|
onClose: close,
|
|
@@ -9505,7 +9823,7 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
|
|
|
9505
9823
|
moreOptionsLabel: ui.moreOptions
|
|
9506
9824
|
}
|
|
9507
9825
|
),
|
|
9508
|
-
monitor && /* @__PURE__ */
|
|
9826
|
+
monitor && /* @__PURE__ */ jsx96(
|
|
9509
9827
|
TabBar,
|
|
9510
9828
|
{
|
|
9511
9829
|
monitor,
|
|
@@ -9517,9 +9835,9 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
|
|
|
9517
9835
|
gamesEnabled: gamesResult?.enabled ?? false
|
|
9518
9836
|
}
|
|
9519
9837
|
),
|
|
9520
|
-
/* @__PURE__ */
|
|
9521
|
-
/* @__PURE__ */
|
|
9522
|
-
showDial ? /* @__PURE__ */
|
|
9838
|
+
/* @__PURE__ */ jsxs81("div", { ref: layerRef, className: "ss-w-chat-layer", "data-dial": presetGrid ? "" : void 0, style: onChatTab ? void 0 : HIDDEN_LAYER_STYLE, children: [
|
|
9839
|
+
/* @__PURE__ */ jsx96(PresetToolsContext.Provider, { value: toolsValue, children: /* @__PURE__ */ jsx96(MessageList, { controller, ui, slip, onDashboardTap, monitor }) }),
|
|
9840
|
+
showDial ? /* @__PURE__ */ jsx96(
|
|
9523
9841
|
PresetSpeedDial,
|
|
9524
9842
|
{
|
|
9525
9843
|
expanded: dial.expanded,
|
|
@@ -9531,12 +9849,12 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
|
|
|
9531
9849
|
buttonRef: dialButtonRef
|
|
9532
9850
|
}
|
|
9533
9851
|
) : null,
|
|
9534
|
-
tool && presetGrid && onChatTab && !paused ? tool.kind === "numbers" ? /* @__PURE__ */
|
|
9852
|
+
tool && presetGrid && onChatTab && !paused ? tool.kind === "numbers" ? /* @__PURE__ */ jsx96(SetNumbersTool, { grid: presetGrid, strings: ui.presets, streaming: state.isStreaming, onSend: sendAsk, onClose: closeTool }) : /* @__PURE__ */ jsx96(BuildComboTool, { grid: presetGrid, strings: ui.presets, streaming: state.isStreaming, formatKickoff, initialTotal: tool.total, initialLegs: tool.legs, onSend: sendAsk, onClose: closeTool }) : null
|
|
9535
9853
|
] }),
|
|
9536
|
-
monitor && discovery && monitor.activeTab === "today" && /* @__PURE__ */
|
|
9537
|
-
monitor && monitor.activeTab === "following" && /* @__PURE__ */
|
|
9538
|
-
monitor && monitor.activeTab === "odds" && /* @__PURE__ */
|
|
9539
|
-
monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */
|
|
9854
|
+
monitor && discovery && monitor.activeTab === "today" && /* @__PURE__ */ jsx96(TodayPanel, { discovery, ui, monitor }),
|
|
9855
|
+
monitor && monitor.activeTab === "following" && /* @__PURE__ */ jsx96(MatchesPanel, { monitor, ui, slip, onAsk: paused ? void 0 : handleAsk }),
|
|
9856
|
+
monitor && monitor.activeTab === "odds" && /* @__PURE__ */ jsx96(OddsPanel, { monitor, ui, slip }),
|
|
9857
|
+
monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */ jsx96(
|
|
9540
9858
|
GamesPanel,
|
|
9541
9859
|
{
|
|
9542
9860
|
loggedIn: !!loggedIn,
|
|
@@ -9550,7 +9868,7 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
|
|
|
9550
9868
|
}
|
|
9551
9869
|
}
|
|
9552
9870
|
),
|
|
9553
|
-
monitor && monitor.activeTab === "leaderboard" && leaderboardResult && /* @__PURE__ */
|
|
9871
|
+
monitor && monitor.activeTab === "leaderboard" && leaderboardResult && /* @__PURE__ */ jsx96(
|
|
9554
9872
|
LeaderboardPanel,
|
|
9555
9873
|
{
|
|
9556
9874
|
loggedIn: !!loggedIn,
|
|
@@ -9560,9 +9878,9 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
|
|
|
9560
9878
|
ui
|
|
9561
9879
|
}
|
|
9562
9880
|
),
|
|
9563
|
-
(!monitor || monitor.activeTab !== "games" && monitor.activeTab !== "leaderboard") && /* @__PURE__ */
|
|
9564
|
-
/* @__PURE__ */
|
|
9565
|
-
paused ? null : /* @__PURE__ */
|
|
9881
|
+
(!monitor || monitor.activeTab !== "games" && monitor.activeTab !== "leaderboard") && /* @__PURE__ */ jsxs81(Fragment23, { children: [
|
|
9882
|
+
/* @__PURE__ */ jsx96("div", { ref: limitRef, className: "ss-w-limit", role: "status", tabIndex: -1, children: state.limit ? limitText(state.limit, ui) : null }),
|
|
9883
|
+
paused ? null : /* @__PURE__ */ jsx96(
|
|
9566
9884
|
ChatInput,
|
|
9567
9885
|
{
|
|
9568
9886
|
ref: inputRef,
|
|
@@ -9581,9 +9899,9 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
|
|
|
9581
9899
|
}
|
|
9582
9900
|
|
|
9583
9901
|
// src/components/HostEventsProvider.tsx
|
|
9584
|
-
import { jsx as
|
|
9902
|
+
import { jsx as jsx97 } from "react/jsx-runtime";
|
|
9585
9903
|
function HostEventsProvider({ value, children }) {
|
|
9586
|
-
return /* @__PURE__ */
|
|
9904
|
+
return /* @__PURE__ */ jsx97(SlipStateContext.Provider, { value: value.slipState, children });
|
|
9587
9905
|
}
|
|
9588
9906
|
|
|
9589
9907
|
// src/styles/css.generated.ts
|
|
@@ -10776,14 +11094,60 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
|
|
|
10776
11094
|
.ss-w-sec-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--ss-w-neg); flex: none; }
|
|
10777
11095
|
.ss-w-today-live { display: flex; flex-direction: column; gap: 2px; }
|
|
10778
11096
|
|
|
10779
|
-
|
|
10780
|
-
|
|
10781
|
-
.ss-w-
|
|
10782
|
-
|
|
10783
|
-
|
|
10784
|
-
|
|
10785
|
-
|
|
10786
|
-
.ss-w-
|
|
11097
|
+
/* Today tab root (Task 7): position: relative so the grid's own star/unstar toast (absolute,
|
|
11098
|
+
top-centre) anchors here rather than to some unrelated positioned ancestor. */
|
|
11099
|
+
/* Non-scrolling anchor for .ss-w-today-toast (position: absolute; top: 0): .ss-w-mon-list below is
|
|
11100
|
+
the overflow-y: auto scroller, so a toast parented to IT would scroll out of view with the
|
|
11101
|
+
content that moved it. This wrapper sits outside that scroller, inside .ss-w-panel's fixed-size
|
|
11102
|
+
flex column, so top: 0 always lands at the visible top of the Today tab. min-height: 0 is
|
|
11103
|
+
required: without it this flex item defaults to min-height: auto (its content height), .ss-w-panel's
|
|
11104
|
+
overflow: hidden then clips it, and .ss-w-mon-list inside never gets a bounded height to scroll within. */
|
|
11105
|
+
.ss-w-today-root { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; }
|
|
11106
|
+
|
|
11107
|
+
/* Section header for "Your leagues"/"Top leagues"/"All leagues" (Task 7) -- same visual
|
|
11108
|
+
treatment as .ss-w-sec-head (the live-band header), kept as a separate class so a kept test
|
|
11109
|
+
asserting .ss-w-sec-head is absent when nothing is live cannot see this header too. */
|
|
11110
|
+
.ss-w-today-sec { display: flex; align-items: center; gap: 7px; padding: 2px 2px 0; font-size: 10px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: var(--ss-w-faint); }
|
|
11111
|
+
.ss-w-today-sec::after { content: ""; flex: 1; height: 1px; background: var(--ss-w-line); }
|
|
11112
|
+
.ss-w-today-sec-sub { text-transform: none; letter-spacing: normal; font-weight: 600; }
|
|
11113
|
+
.ss-w-today-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
|
|
11114
|
+
.ss-w-today-empty { font-size: 12px; color: var(--ss-w-faint); padding: 10px 2px; }
|
|
11115
|
+
|
|
11116
|
+
/* League tile (Task 5): a flat row (crest + name as the open target, star as a separate sibling
|
|
11117
|
+
button) rather than a disclosure header -- opening is Task 6's LeagueDetail, not an inline
|
|
11118
|
+
expansion. Same border/radius language .ss-w-grp used to carry, before Task 7 deleted it. */
|
|
11119
|
+
.ss-w-today-tile { display: flex; align-items: center; gap: 6px; border: 1px solid var(--ss-w-line); border-radius: 12px; overflow: hidden; background: var(--ss-w-bubble); }
|
|
11120
|
+
.ss-w-today-tile-body { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; padding: 8px 9px; background: none; border: none; font: inherit; color: var(--ss-w-ink); cursor: pointer; text-align: left; }
|
|
11121
|
+
.ss-w-today-tile-body:focus-visible { outline: 2px solid var(--ss-w-accent); outline-offset: -2px; }
|
|
11122
|
+
.ss-w-today-tile-name { font-size: 12px; font-weight: 700; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
11123
|
+
.ss-w-today-tile-country { font-weight: 600; color: var(--ss-w-faint); }
|
|
11124
|
+
.ss-w-today-tile-star { flex: none; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin: 0 6px; background: none; border: none; border-radius: 8px; color: var(--ss-w-faint); cursor: pointer; }
|
|
11125
|
+
.ss-w-today-tile-star:focus-visible { outline: 2px solid var(--ss-w-accent); outline-offset: -2px; }
|
|
11126
|
+
.ss-w-today-tile-star[aria-pressed="true"] { color: var(--ss-w-accent); }
|
|
11127
|
+
.ss-w-today-tile-star:disabled { cursor: default; opacity: .4; }
|
|
11128
|
+
.ss-w-today-tile-star svg { width: 18px; height: 18px; }
|
|
11129
|
+
|
|
11130
|
+
/* League detail (Task 6): the drill-in view opened from a tile. Its header star is always
|
|
11131
|
+
enabled (spec \xA73/\xA77's one exception to the tile rule), so it carries no :disabled styling. */
|
|
11132
|
+
.ss-w-today-detail { position: relative; display: flex; flex-direction: column; gap: 10px; }
|
|
11133
|
+
.ss-w-today-detail-head { display: flex; align-items: center; gap: 8px; }
|
|
11134
|
+
.ss-w-today-detail-back { flex: none; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; background: none; border: none; border-radius: 8px; color: var(--ss-w-ink); cursor: pointer; transform: scaleX(-1); }
|
|
11135
|
+
.ss-w-today-detail-back:focus-visible { outline: 2px solid var(--ss-w-accent); outline-offset: -2px; }
|
|
11136
|
+
.ss-w-today-detail-name { flex: 1; min-width: 0; font-size: 13px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
11137
|
+
.ss-w-today-detail-star { flex: none; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; background: none; border: none; border-radius: 8px; color: var(--ss-w-faint); cursor: pointer; }
|
|
11138
|
+
.ss-w-today-detail-star:focus-visible { outline: 2px solid var(--ss-w-accent); outline-offset: -2px; }
|
|
11139
|
+
.ss-w-today-detail-star[aria-pressed="true"] { color: var(--ss-w-accent); }
|
|
11140
|
+
.ss-w-today-detail-star svg { width: 18px; height: 18px; }
|
|
11141
|
+
.ss-w-today-detail-nav { display: flex; align-items: center; justify-content: center; gap: 10px; }
|
|
11142
|
+
.ss-w-today-detail-prev, .ss-w-today-detail-next { flex: none; display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; background: none; border: none; border-radius: 8px; color: var(--ss-w-faint); cursor: pointer; }
|
|
11143
|
+
.ss-w-today-detail-prev:focus-visible, .ss-w-today-detail-next:focus-visible { outline: 2px solid var(--ss-w-accent); outline-offset: -2px; }
|
|
11144
|
+
.ss-w-today-detail-prev { transform: scaleX(-1); }
|
|
11145
|
+
.ss-w-today-detail-pos { font-size: 10.5px; font-weight: 700; color: var(--ss-w-faint); font-variant-numeric: tabular-nums; }
|
|
11146
|
+
.ss-w-today-detail-body { display: flex; flex-direction: column; }
|
|
11147
|
+
.ss-w-today-detail-count { align-self: flex-end; flex: none; font-size: 10.5px; font-weight: 700; color: var(--ss-w-faint); background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); border-radius: 999px; padding: 1px 7px; font-variant-numeric: tabular-nums; margin-bottom: 4px; }
|
|
11148
|
+
/* aria-live status region, not a modal -- pointer-events: none so the header/nav above stay
|
|
11149
|
+
clickable while it is showing. */
|
|
11150
|
+
.ss-w-today-toast { position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: 1; pointer-events: none; width: max-content; max-width: 220px; font-size: 11px; font-weight: 560; color: var(--ss-w-accent); background: color-mix(in srgb, var(--ss-w-accent) 14%, var(--ss-w-panel)); border: 1px solid color-mix(in srgb, var(--ss-w-accent) 30%, var(--ss-w-line)); border-radius: 10px; padding: 5px 10px; box-shadow: 0 4px 14px rgba(0,0,0,.14); }
|
|
10787
11151
|
|
|
10788
11152
|
.ss-w-drow { display: grid; grid-template-columns: 42px minmax(0,1fr) 22px; align-items: center; gap: 9px; padding: 7px 0; border-bottom: 1px solid var(--ss-w-line); }
|
|
10789
11153
|
.ss-w-drow:last-child { border-bottom: none; }
|
|
@@ -11269,7 +11633,7 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
|
|
|
11269
11633
|
`;
|
|
11270
11634
|
|
|
11271
11635
|
// src/StatsWidget.tsx
|
|
11272
|
-
import { jsx as
|
|
11636
|
+
import { jsx as jsx98 } from "react/jsx-runtime";
|
|
11273
11637
|
function buildClient(props) {
|
|
11274
11638
|
try {
|
|
11275
11639
|
if ("client" in props && props.client) {
|
|
@@ -11294,24 +11658,24 @@ function injectStyles(root) {
|
|
|
11294
11658
|
function StatsWidget(props) {
|
|
11295
11659
|
const injectedClient = "client" in props ? props.client : void 0;
|
|
11296
11660
|
const cfg = props.config;
|
|
11297
|
-
const built =
|
|
11298
|
-
const logger =
|
|
11661
|
+
const built = useMemo6(() => buildClient(props), [injectedClient, cfg?.operatorId, cfg?.publicKey, cfg?.baseUrl]);
|
|
11662
|
+
const logger = useMemo6(
|
|
11299
11663
|
() => built ? built.client.createEventLogger({
|
|
11300
11664
|
operatorUserId: cfg?.userContext?.operatorUserId,
|
|
11301
11665
|
anonymousUserId: cfg?.userContext?.anonymousUserId
|
|
11302
11666
|
}) : null,
|
|
11303
11667
|
[built?.client]
|
|
11304
11668
|
);
|
|
11305
|
-
const ui =
|
|
11306
|
-
const rootRef =
|
|
11307
|
-
const introDoneRef =
|
|
11308
|
-
const markIntroDone =
|
|
11669
|
+
const ui = useMemo6(() => normalizeUi(props.config ?? { operatorId: "", publicKey: "" }), [props.config]);
|
|
11670
|
+
const rootRef = useRef24(null);
|
|
11671
|
+
const introDoneRef = useRef24(false);
|
|
11672
|
+
const markIntroDone = useCallback17(() => {
|
|
11309
11673
|
introDoneRef.current = true;
|
|
11310
11674
|
}, []);
|
|
11311
11675
|
const convStorageKey = `ss-w-conv:${cfg?.operatorId ?? ""}:${cfg?.userContext?.operatorUserId ?? "anon"}`;
|
|
11312
11676
|
const controller = useChatStream(built?.conversation ?? emptyConversation(), ui.starters, built ? ui.greetingMessage : void 0, convStorageKey);
|
|
11313
|
-
const [hasToday, setHasToday] =
|
|
11314
|
-
const liveCardWatches =
|
|
11677
|
+
const [hasToday, setHasToday] = useState48(false);
|
|
11678
|
+
const liveCardWatches = useMemo6(() => {
|
|
11315
11679
|
const seen = /* @__PURE__ */ new Set();
|
|
11316
11680
|
const out = [];
|
|
11317
11681
|
for (const msg of controller.state.messages) {
|
|
@@ -11333,31 +11697,40 @@ function StatsWidget(props) {
|
|
|
11333
11697
|
hasToday,
|
|
11334
11698
|
watches: liveCardWatches
|
|
11335
11699
|
});
|
|
11336
|
-
const
|
|
11337
|
-
|
|
11338
|
-
|
|
11700
|
+
const operatorUserId = cfg?.userContext?.operatorUserId;
|
|
11701
|
+
const anonymousUserId = cfg?.userContext?.anonymousUserId;
|
|
11702
|
+
const getSchedule = useCallback17(
|
|
11703
|
+
(localDate, utcOffsetMinutes) => built ? built.conversation.getSchedule(localDate, utcOffsetMinutes, operatorUserId, anonymousUserId) : Promise.resolve(null),
|
|
11704
|
+
[built, operatorUserId, anonymousUserId]
|
|
11339
11705
|
);
|
|
11340
|
-
const
|
|
11706
|
+
const postLeagueStar = useCallback17(
|
|
11707
|
+
(competitionId, starred) => built ? built.conversation.starLeague(competitionId, starred, operatorUserId, anonymousUserId) : Promise.resolve(null),
|
|
11708
|
+
[built, operatorUserId, anonymousUserId]
|
|
11709
|
+
);
|
|
11710
|
+
const getStates = useCallback17(
|
|
11341
11711
|
(matchIds) => built ? built.conversation.getStates(matchIds) : Promise.resolve(null),
|
|
11342
11712
|
[built]
|
|
11343
11713
|
);
|
|
11344
|
-
const pinnedMatchIds =
|
|
11714
|
+
const pinnedMatchIds = useMemo6(
|
|
11345
11715
|
() => monitor.pins.filter((p) => p.kind === "match").map((p) => p.matchId),
|
|
11346
11716
|
[monitor.pins]
|
|
11347
11717
|
);
|
|
11348
11718
|
const discovery = useMatchDiscovery({
|
|
11349
11719
|
getSchedule,
|
|
11350
11720
|
getStates,
|
|
11721
|
+
postLeagueStar,
|
|
11351
11722
|
operatorId: cfg?.operatorId ?? "",
|
|
11723
|
+
operatorUserId,
|
|
11724
|
+
anonymousUserId,
|
|
11352
11725
|
isOpen: controller.state.isOpen,
|
|
11353
11726
|
pinnedMatchIds
|
|
11354
11727
|
});
|
|
11355
11728
|
const todayHasContent = visibleGroupsOf(discovery.groups, discovery.states).length > 0;
|
|
11356
|
-
|
|
11729
|
+
useEffect29(() => {
|
|
11357
11730
|
setHasToday(todayHasContent);
|
|
11358
11731
|
}, [todayHasContent]);
|
|
11359
|
-
const prevLiveSnapshotRef =
|
|
11360
|
-
|
|
11732
|
+
const prevLiveSnapshotRef = useRef24(monitor.snapshot);
|
|
11733
|
+
useEffect29(() => {
|
|
11361
11734
|
const snap = monitor.snapshot;
|
|
11362
11735
|
if (!snap || snap === prevLiveSnapshotRef.current) return;
|
|
11363
11736
|
prevLiveSnapshotRef.current = snap;
|
|
@@ -11393,14 +11766,14 @@ function StatsWidget(props) {
|
|
|
11393
11766
|
}, [monitor.snapshot]);
|
|
11394
11767
|
const gamesResult = useGames(built?.conversation ?? null, { activeTab: monitor.activeTab });
|
|
11395
11768
|
const leaderboardResult = useLeaderboard(built?.conversation ?? null, { activeTab: monitor.activeTab });
|
|
11396
|
-
const getPricePresets =
|
|
11769
|
+
const getPricePresets = useCallback17(
|
|
11397
11770
|
(locale2) => built ? built.conversation.getPricePresets(locale2, { pool: "open" }) : Promise.resolve(null),
|
|
11398
11771
|
[built]
|
|
11399
11772
|
);
|
|
11400
11773
|
const presetGrid = usePresetGrid({ getPricePresets, isOpen: controller.state.isOpen, locale: ui.presets.lang });
|
|
11401
11774
|
const markTodayActivity = monitor.markTodayActivity;
|
|
11402
|
-
const prevLiveCountRef =
|
|
11403
|
-
|
|
11775
|
+
const prevLiveCountRef = useRef24(0);
|
|
11776
|
+
useEffect29(() => {
|
|
11404
11777
|
const rose = prevLiveCountRef.current === 0 && discovery.liveCount > 0;
|
|
11405
11778
|
prevLiveCountRef.current = discovery.liveCount;
|
|
11406
11779
|
if (rose) markTodayActivity();
|
|
@@ -11414,7 +11787,7 @@ function StatsWidget(props) {
|
|
|
11414
11787
|
closePanel: controller.close
|
|
11415
11788
|
});
|
|
11416
11789
|
const markAdded = hostEvents.markAdded;
|
|
11417
|
-
const slip =
|
|
11790
|
+
const slip = useMemo6(
|
|
11418
11791
|
() => {
|
|
11419
11792
|
const handler = props.config?.onAddToSlip;
|
|
11420
11793
|
return {
|
|
@@ -11433,7 +11806,7 @@ function StatsWidget(props) {
|
|
|
11433
11806
|
},
|
|
11434
11807
|
[props.config?.onAddToSlip, controller.state.conversationId, markAdded]
|
|
11435
11808
|
);
|
|
11436
|
-
const onDashboardTap =
|
|
11809
|
+
const onDashboardTap = useMemo6(
|
|
11437
11810
|
() => built ? createDashboardTapSignal((input) => built.conversation.sendSignal(input), logger) : void 0,
|
|
11438
11811
|
[built, logger]
|
|
11439
11812
|
);
|
|
@@ -11449,14 +11822,12 @@ function StatsWidget(props) {
|
|
|
11449
11822
|
log: logger
|
|
11450
11823
|
})
|
|
11451
11824
|
}));
|
|
11452
|
-
const operatorUserId = cfg?.userContext?.operatorUserId;
|
|
11453
|
-
const anonymousUserId = cfg?.userContext?.anonymousUserId;
|
|
11454
11825
|
const conversationId = controller.state.conversationId ?? void 0;
|
|
11455
|
-
|
|
11826
|
+
useEffect29(() => {
|
|
11456
11827
|
if (!logger) return;
|
|
11457
11828
|
logger.setIdentity({ operatorUserId, anonymousUserId, conversationId });
|
|
11458
11829
|
}, [logger, operatorUserId, anonymousUserId, conversationId]);
|
|
11459
|
-
|
|
11830
|
+
useEffect29(() => {
|
|
11460
11831
|
if (!logger) return;
|
|
11461
11832
|
logger.resume();
|
|
11462
11833
|
const onHide = () => {
|
|
@@ -11474,14 +11845,14 @@ function StatsWidget(props) {
|
|
|
11474
11845
|
logger.dispose();
|
|
11475
11846
|
};
|
|
11476
11847
|
}, [logger]);
|
|
11477
|
-
|
|
11848
|
+
useEffect29(() => {
|
|
11478
11849
|
if (!built || !ui.injectStyles) return;
|
|
11479
11850
|
const node = rootRef.current?.getRootNode();
|
|
11480
11851
|
if (node) injectStyles(node);
|
|
11481
11852
|
}, [built, ui.injectStyles]);
|
|
11482
11853
|
if (!built) return null;
|
|
11483
11854
|
const attrs = themeAttrs(ui);
|
|
11484
|
-
return /* @__PURE__ */
|
|
11855
|
+
return /* @__PURE__ */ jsx98(EventLogContext.Provider, { value: logger, children: /* @__PURE__ */ jsx98(HostEventsProvider, { value: hostEvents, children: /* @__PURE__ */ jsx98("div", { ref: rootRef, className: "ss-w-root", "data-ss-w-theme": attrs["data-ss-w-theme"], "data-ss-w-pos": attrs["data-ss-w-pos"], style: attrs.style, children: controller.state.isOpen ? /* @__PURE__ */ jsx98(
|
|
11485
11856
|
ChatPanel,
|
|
11486
11857
|
{
|
|
11487
11858
|
controller,
|
|
@@ -11496,7 +11867,7 @@ function StatsWidget(props) {
|
|
|
11496
11867
|
conversation: built?.conversation ?? null,
|
|
11497
11868
|
presetGrid
|
|
11498
11869
|
}
|
|
11499
|
-
) : /* @__PURE__ */
|
|
11870
|
+
) : /* @__PURE__ */ jsx98(
|
|
11500
11871
|
ChatFab,
|
|
11501
11872
|
{
|
|
11502
11873
|
label: ui.launcherLabel,
|