/* global React, TeamDisc, Jersey, Form, Panel, SlashHeading, SplitBar */ const PLx = window.PL; /* ---------- Player leaders: Goals / Assists tabbed ---------- */ function PlayerLeaders() { const [tab, setTab] = React.useState('goals'); const list = tab === 'goals' ? PLx.scorers : PLx.assisters; const max = tab === 'goals' ? list[0].g : list[0].a; const leader = list[0]; return (
{/* hero leader */}
{tab === 'goals' ? 'Golden Boot' : 'Playmaker'}
{leader.name}
{PLx.T[leader.t].name}
{tab === 'goals' ? leader.g : leader.a}
{tab === 'goals' ? 'Goals' : 'Assists'}
{/* rest */}
{list.slice(1, 5).map((p) => { const val = tab === 'goals' ? p.g : p.a; const sub = tab === 'goals' ? `${p.a} ast · ${p.pens || 0} pens` : `${p.g} gls · ${p.key} key passes`; return (
{p.rk}
{p.name}
{sub}
{val}
); })}
); } /* ---------- In-form table (last 5) ---------- */ function FormGuide() { const rows = [...PLx.inForm].sort((a, b) => b.pts5 - a.pts5 || b.gd5 - a.gd5); const max = 15; return (
{rows.map((r, i) => (
{i + 1} {PLx.T[r.t].name}
{r.pts5} pts GD {r.gd5 > 0 ? '+' : ''}{r.gd5}
))}
); } /* ---------- Match of the weekend spotlight ---------- */ function MatchSpotlight() { const s = PLx.spotlight; const hc = PLx.T[s.h], ac = PLx.T[s.a]; const hForm = (PLx.table.find((r) => r.t === s.h) || {}).form || []; const aForm = (PLx.table.find((r) => r.t === s.a) || {}).form || []; const ord = (n) => n + (n === 1 ? 'st' : n === 2 ? 'nd' : n === 3 ? 'rd' : 'th'); const hPos = (PLx.table.find((r) => r.t === s.h) || {}).pos; const aPos = (PLx.table.find((r) => r.t === s.a) || {}).pos; const [tab, setTab] = React.useState('season'); return (
{ord(hPos)} v {ord(aPos)} )} /> {/* teams + kickoff */}
{hc.name}
{s.time}
{s.day}
{s.venue}
{ac.name}
{/* tabbed comparison on white */}
{tab === 'season' ? (
{s.stats.map((st) => { const total = (st.h + st.a) || 1; const u = st.unit || ''; return (
= st.a ? 'var(--text-brand)' : 'var(--text-muted)' }}>{st.h}{u} {st.label} = st.h ? 'var(--text-brand)' : 'var(--text-muted)' }}>{st.a}{u}
); })}
) : (
{hc.name} Last {s.h2h.meetings} meetings {ac.name}
{s.h2h.rows.map((row) => (
{row.h} {row.label} {row.a}
))}
)} {/* recent form into the match */}
Last 5
); } /* ---------- Fixtures + live results ---------- */ function Scoreline({ m }) { const live = m.state === 'live'; const epo = live && Math.abs(m.hs - m.as) >= 2; const nm = { fontFamily: 'var(--font-body)', fontWeight: 700, fontSize: 13, color: 'var(--text-primary)', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }; return (
{PLx.T[m.h].name} {live ? {m.hs}–{m.as} : {m.day} {m.time}} {live && {m.min}} {PLx.T[m.a].name} {epo && }
); } function Fixtures() { const [tab, setTab] = React.useState('upcoming'); const Team = ({ code, align }) => (
{PLx.T[code].name}
); const Row = ({ m, result }) => (
{m.date}
{result ? 'Full time' : m.time}
{result ? ( {m.hs}–{m.as} ) : ( VS )}
); return (
{tab === 'results' ? PLx.results.map((m, i) => ) : PLx.upcoming.map((m, i) => )}
); } Object.assign(window, { PlayerLeaders, FormGuide, MatchSpotlight, Fixtures });