@jjlmoya/utils-sports 1.49.0 → 1.50.0

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jjlmoya/utils-sports",
-    "version": "1.49.0",
+    "version": "1.50.0",
     "type": "module",
     "main": "./src/index.ts",
     "types": "./src/index.ts",

package/src/category/index.ts

@@ -12,6 +12,7 @@ import { baseballScoreKeeper } from '../tool/baseballScoreKeeper/entry';
 import { penaltyShootout } from '../tool/penaltyShootout/entry';
 import { swimCssCalculator } from '../tool/swimCssCalculator/entry';
 import { vo2MaxCalculator } from '../tool/vo2MaxCalculator/entry';
+import { roundRobinLeagueManager } from '../tool/roundRobinLeagueManager/entry';
 
 export const sportsCategory: SportsCategoryEntry = {
   icon: 'mdi:soccer',
@@ -29,6 +30,7 @@ export const sportsCategory: SportsCategoryEntry = {
     penaltyShootout,
     swimCssCalculator,
     vo2MaxCalculator,
+    roundRobinLeagueManager,
   ] as unknown as SportsToolEntry<Record<string, string>>[],
   i18n: {
     es: () => import('./i18n/es').then((m) => m.content),

package/src/entries.ts

@@ -40,6 +40,8 @@ export { volleyballScoreKeeper } from './tool/volleyballScoreKeeper/entry';
 export type { VolleyballScoreKeeperLocaleContent } from './tool/volleyballScoreKeeper/entry';
 export { vo2MaxCalculator } from './tool/vo2MaxCalculator/entry';
 export type { Vo2MaxCalculatorLocaleContent } from './tool/vo2MaxCalculator/entry';
+export { roundRobinLeagueManager } from './tool/roundRobinLeagueManager/entry';
+export type { RoundRobinLeagueManagerLocaleContent } from './tool/roundRobinLeagueManager/entry';
 
 export { sportsCategory } from './category';
 
@@ -64,6 +66,7 @@ import { runningPacePredictor } from './tool/runningPacePredictor/entry';
 import { swimCssCalculator } from './tool/swimCssCalculator/entry';
 import { volleyballScoreKeeper } from './tool/volleyballScoreKeeper/entry';
 import { vo2MaxCalculator } from './tool/vo2MaxCalculator/entry';
+import { roundRobinLeagueManager } from './tool/roundRobinLeagueManager/entry';
 
 export const ALL_ENTRIES = [
   basketScoreKeeper,
@@ -87,4 +90,5 @@ export const ALL_ENTRIES = [
   swimCssCalculator,
   volleyballScoreKeeper,
   vo2MaxCalculator,
+  roundRobinLeagueManager,
 ];

package/src/index.ts

@@ -37,3 +37,6 @@ export type { PenaltyShootoutUI, PenaltyShootoutLocaleContent } from './tool/pen
 
 export { VOLLEYBALL_SCOREKEEPER_TOOL, volleyballScoreKeeper } from './tool/volleyballScoreKeeper/index';
 export type { VolleyballScoreKeeperUI, VolleyballScoreKeeperLocaleContent } from './tool/volleyballScoreKeeper/index';
+
+export { ROUND_ROBIN_LEAGUE_MANAGER_TOOL, roundRobinLeagueManager } from './tool/roundRobinLeagueManager/index';
+export type { RoundRobinLeagueManagerUI, RoundRobinLeagueManagerLocaleContent } from './tool/roundRobinLeagueManager/index';

package/src/tests/seo_translation_completeness.test.ts

@@ -0,0 +1,69 @@
+import { describe, it, expect } from 'vitest';
+import { ALL_TOOLS } from '../tools';
+
+const ASIAN_LOCALES = ['ja', 'ko', 'zh'];
+
+function getSimpleSectionLength(section: any): number {
+  if (section.type === 'title') return section.text ? section.text.length : 0;
+  if (section.type === 'paragraph') return section.html ? section.html.replace(/<[^>]*>/g, '').length : 0;
+  if (section.type === 'list') return section.items ? section.items.join('').length : 0;
+  return 0;
+}
+
+function getComplexSectionLength(section: any): number {
+  if (section.type === 'diagnostic' || section.type === 'tip') {
+    return (section.title ? section.title.length : 0) + (section.html ? section.html.replace(/<[^>]*>/g, '').length : 0);
+  }
+  if (section.type === 'table') {
+    return ((section.headers || []).join('').length) + ((section.rows || []).flat().join('').length);
+  }
+  return 0;
+}
+
+function getSectionLength(section: any): number {
+  return getSimpleSectionLength(section) || getComplexSectionLength(section);
+}
+
+function calculateSeoTextLength(seoSections: any[]): number {
+  return seoSections.reduce((acc, section) => acc + getSectionLength(section), 0);
+}
+
+function checkLocaleSeoLength(toolId: string, locale: string, localeLen: number, enLen: number): void {
+  const isAsian = ASIAN_LOCALES.includes(locale);
+  const minLength = Math.floor(enLen * (isAsian ? 0.25 : 0.70));
+  const msgType = isAsian ? 'suspiciously short' : 'truncated/lazy';
+
+  expect(
+    localeLen,
+    `[LAZY SEO TRANSLATION] Tool "${toolId}" locale "${locale}" SEO text is ${msgType} (${localeLen} chars vs EN ${enLen} chars, expected min ${minLength})`,
+  ).toBeGreaterThanOrEqual(minLength);
+}
+
+async function auditSingleLocale(toolId: string, locale: string, loader: any, enSeoLength: number): Promise<void> {
+  if (locale === 'en' || !loader) return;
+  const content = await loader();
+  if (!content.seo || !Array.isArray(content.seo)) return;
+
+  checkLocaleSeoLength(toolId, locale, calculateSeoTextLength(content.seo), enSeoLength);
+}
+
+describe('SEO Translation Completeness & Laziness Audit', () => {
+  ALL_TOOLS.forEach(({ entry }) => {
+    describe(`Tool: ${entry.id}`, () => {
+      it('should not have lazy or truncated SEO content compared to English reference', async () => {
+        const enLoader = entry.i18n['en' as keyof typeof entry.i18n];
+        if (!enLoader) return;
+
+        const enContent = await enLoader();
+        if (!enContent.seo || !Array.isArray(enContent.seo)) return;
+
+        const enSeoLength = calculateSeoTextLength(enContent.seo);
+
+        for (const [locale, loader] of Object.entries(entry.i18n)) {
+          await auditSingleLocale(entry.id, locale, loader, enSeoLength);
+        }
+      });
+    });
+  });
+});
+

package/src/tool/roundRobinLeagueManager/bibliography.astro

@@ -0,0 +1,6 @@
+---
+import { Bibliography as SharedBibliography } from '@jjlmoya/utils-shared';
+import { bibliography } from './bibliography';
+---
+
+<SharedBibliography links={bibliography} />

package/src/tool/roundRobinLeagueManager/bibliography.ts

@@ -0,0 +1,12 @@
+import type { BibliographyEntry } from '../../types';
+
+export const bibliography: BibliographyEntry[] = [
+  {
+    name: 'FIDE Handbook: Berger Tables for Round Robin Tournaments',
+    url: 'https://handbook.fide.com/files/handbook/C02Standards.pdf',
+  },
+  {
+    name: 'Premier League Handbook: League Competition Rules',
+    url: 'https://resources.premierleague.pulselive.com/premierleague/document/2025/07/24/99839920-d274-42aa-a2ac-e5612b4f6c61/PL_Handbook_25-26_Digital_24.07.pdf',
+  },
+];

package/src/tool/roundRobinLeagueManager/client-io.ts

@@ -0,0 +1,35 @@
+import { createLeagueShareUrl } from './sharing';
+import { isLeagueRecord, type LeagueRecord } from './logic';
+
+export function createClientId(): string {
+  if (typeof crypto.randomUUID === 'function') return crypto.randomUUID();
+  return `league-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
+}
+
+export async function copyLeagueLink(record: LeagueRecord): Promise<boolean> {
+  try {
+    await navigator.clipboard.writeText(createLeagueShareUrl(window.location.href, record));
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+export function downloadLeagueBackup(record: LeagueRecord): void {
+  const blob = new Blob([JSON.stringify(record, null, 2)], { type: 'application/json' });
+  const url = URL.createObjectURL(blob);
+  const anchor = document.createElement('a');
+  anchor.href = url;
+  anchor.download = `${record.config.name.toLowerCase().replace(/[^a-z0-9]+/g, '-') || 'league'}.json`;
+  anchor.click();
+  URL.revokeObjectURL(url);
+}
+
+export async function readLeagueBackup(file: File): Promise<LeagueRecord | null> {
+  try {
+    const parsed: unknown = JSON.parse(await file.text());
+    return isLeagueRecord(parsed) ? parsed : null;
+  } catch {
+    return null;
+  }
+}

package/src/tool/roundRobinLeagueManager/component.astro

@@ -0,0 +1,195 @@
+---
+import './round-robin-league-manager.css';
+import type { RoundRobinLeagueManagerUI } from './ui';
+
+interface Props {
+  ui: RoundRobinLeagueManagerUI;
+}
+
+const { ui } = Astro.props;
+const uiJson = JSON.stringify(ui).replace(/</g, '\\u003c');
+---
+
+<div class="rlm-tool" data-round-robin-league-manager data-active-tab="matches">
+  <script is:inline type="application/json" data-role="ui-json" set:html={uiJson}></script>
+
+  <section class="rlm-library" data-view="library">
+    <header class="rlm-library-header">
+      <div>
+        <span class="rlm-eyebrow">{ui.libraryEyebrow}</span>
+        <div class="rlm-title-line">
+          <h2>{ui.myLeagues}</h2>
+          <span class="rlm-count" data-role="league-count">0</span>
+        </div>
+        <p>{ui.libraryIntro}</p>
+      </div>
+      <label class="rlm-import-button">
+        {ui.importLeague}
+        <input type="file" accept="application/json" data-role="import-file" />
+      </label>
+    </header>
+
+    <p class="rlm-notice" data-role="notice" aria-live="polite"></p>
+
+    <div class="rlm-library-grid">
+      <div class="rlm-league-stack">
+        <div class="rlm-empty-library" data-role="library-empty">
+          <strong>{ui.noLeagues}</strong>
+          <span>{ui.noLeaguesHint}</span>
+        </div>
+        <div class="rlm-league-list" data-role="league-list"></div>
+      </div>
+
+      <form class="rlm-create-card" data-role="create-form">
+        <div class="rlm-card-heading">
+          <span class="rlm-card-number">+</span>
+          <div>
+            <h3>{ui.newLeague}</h3>
+            <button type="button" class="rlm-example" data-action="load-example">{ui.loadExample}</button>
+          </div>
+        </div>
+
+        <label class="rlm-field">
+          <span>{ui.leagueNameLabel}</span>
+          <input type="text" maxlength="60" placeholder={ui.leagueNamePlaceholder} data-role="league-name" />
+        </label>
+
+        <label class="rlm-field">
+          <span>{ui.teamsLabel}</span>
+          <small>{ui.teamsHint}</small>
+          <textarea rows="7" maxlength="1024" placeholder={ui.teamsPlaceholder} data-role="teams"></textarea>
+        </label>
+
+        <fieldset class="rlm-fieldset">
+          <legend>{ui.formatLabel}</legend>
+          <div class="rlm-choice-row">
+            <button type="button" data-format="single" aria-pressed="true">
+              <strong>{ui.singleLeg}</strong>
+              <span>{ui.singleLegHint}</span>
+            </button>
+            <button type="button" data-format="double" aria-pressed="false">
+              <strong>{ui.doubleLeg}</strong>
+              <span>{ui.doubleLegHint}</span>
+            </button>
+          </div>
+        </fieldset>
+
+        <fieldset class="rlm-fieldset">
+          <legend>{ui.scoringLabel}</legend>
+          <div class="rlm-points-row">
+            <label><span>{ui.winPoints}</span><input type="number" min="0" max="20" value="3" data-role="draft-win" /></label>
+            <label><span>{ui.drawPoints}</span><input type="number" min="0" max="20" value="1" data-role="draft-draw" /></label>
+            <label><span>{ui.lossPoints}</span><input type="number" min="0" max="20" value="0" data-role="draft-loss" /></label>
+          </div>
+        </fieldset>
+
+        <p class="rlm-draft-status" data-role="draft-status" aria-live="polite"></p>
+        <button type="submit" class="rlm-primary" data-role="create-league" disabled>{ui.createLeague}</button>
+        <p class="rlm-import-hint">{ui.importHint}</p>
+      </form>
+    </div>
+  </section>
+
+  <section class="rlm-manager" data-view="manager" hidden>
+    <header class="rlm-manager-header">
+      <div class="rlm-manager-nav">
+        <button type="button" class="rlm-back" data-action="show-library">{ui.backToLeagues}</button>
+        <button type="button" class="rlm-back" data-action="new-league">+ {ui.newLeagueAction}</button>
+      </div>
+      <div class="rlm-league-identity">
+        <div class="rlm-league-mark" aria-hidden="true"><span></span><span></span><span></span></div>
+        <div>
+          <h2 data-role="active-name"></h2>
+          <p data-role="active-meta"></p>
+        </div>
+      </div>
+      <div class="rlm-manager-actions">
+        <span class="rlm-saved">{ui.allChangesSaved}</span>
+        <button type="button" data-action="download-active">{ui.downloadLeague}</button>
+        <button type="button" class="rlm-share" data-action="share-active">{ui.shareLeague}</button>
+      </div>
+    </header>
+
+    <div class="rlm-progress-strip">
+      <span>{ui.progressLabel}</span>
+      <div><i data-role="progress-bar"></i></div>
+      <strong data-role="progress-text"></strong>
+    </div>
+
+    <nav class="rlm-tabs" aria-label={ui.myLeagues}>
+      <button type="button" data-action="set-tab" data-tab="matches" aria-pressed="true">{ui.matchesTab}</button>
+      <button type="button" data-action="set-tab" data-tab="standings" aria-pressed="false">{ui.standingsTab}</button>
+      <button type="button" data-action="set-tab" data-tab="settings" aria-pressed="false">{ui.settingsTab}</button>
+    </nav>
+
+    <div class="rlm-panel rlm-overview" data-panel="matches">
+      <section class="rlm-fixture-panel">
+        <header class="rlm-panel-heading">
+          <div>
+            <span>{ui.fixtures}</span>
+            <h3 data-role="round-title"></h3>
+          </div>
+          <div class="rlm-round-arrows">
+            <button type="button" data-action="previous-round" aria-label={ui.previousRound}></button>
+            <button type="button" data-action="next-round" aria-label={ui.nextRound}></button>
+          </div>
+        </header>
+        <nav class="rlm-round-list" data-role="round-list" aria-label={ui.matchday}></nav>
+        <div class="rlm-match-list" data-role="match-list"></div>
+        <p class="rlm-bye" data-role="bye" hidden></p>
+      </section>
+
+      <aside class="rlm-standing-panel">
+        <header class="rlm-panel-heading">
+          <div>
+            <span>{ui.standings}</span>
+            <h3>{ui.standingsTab}</h3>
+          </div>
+          <button type="button" class="rlm-text-action" data-action="set-tab" data-tab="standings">{ui.standingsTab}</button>
+        </header>
+        <div class="rlm-table-scroll is-compact" data-role="standings-table"></div>
+      </aside>
+    </div>
+
+    <section class="rlm-panel rlm-full-table" data-panel="standings" hidden>
+      <header class="rlm-section-header">
+        <div><span>{ui.standings}</span><h3>{ui.standingsTab}</h3></div>
+        <p>{ui.standingsHint}</p>
+      </header>
+      <div class="rlm-table-scroll" data-role="standings-table"></div>
+    </section>
+
+    <section class="rlm-panel rlm-settings" data-panel="settings" hidden>
+      <header class="rlm-section-header">
+        <div><span>{ui.settingsTab}</span><h3>{ui.leagueSettings}</h3></div>
+        <p>{ui.settingsHint}</p>
+      </header>
+      <div class="rlm-settings-grid">
+        <label class="rlm-field"><span>{ui.leagueNameLabel}</span><input type="text" maxlength="60" data-role="settings-name" /></label>
+        <fieldset class="rlm-fieldset">
+          <legend>{ui.scoringLabel}</legend>
+          <div class="rlm-points-row">
+            <label><span>{ui.winPoints}</span><input type="number" min="0" max="20" data-role="settings-win" /></label>
+            <label><span>{ui.drawPoints}</span><input type="number" min="0" max="20" data-role="settings-draw" /></label>
+            <label><span>{ui.lossPoints}</span><input type="number" min="0" max="20" data-role="settings-loss" /></label>
+          </div>
+        </fieldset>
+      </div>
+      <button type="button" class="rlm-primary is-small" data-action="save-settings">{ui.saveSettings}</button>
+      <div class="rlm-danger-zone">
+        <div><strong>{ui.dangerZone}</strong><span>{ui.confirmDelete}</span></div>
+        <button type="button" data-action="delete-active">{ui.deleteLeague}</button>
+      </div>
+    </section>
+
+    <p class="rlm-notice" data-role="notice" aria-live="polite"></p>
+  </section>
+</div>
+
+<script>
+  import { initRoundRobinLeagueManager } from './controller';
+
+  document.querySelectorAll<HTMLElement>('[data-round-robin-league-manager]').forEach((root) => {
+    initRoundRobinLeagueManager(root);
+  });
+</script>

package/src/tool/roundRobinLeagueManager/controller.ts

@@ -0,0 +1,234 @@
+import { renderLibrary, renderLiveData, renderManager, renderMatchStatus, renderSettings } from './dom-views';
+import { copyLeagueLink, createClientId, downloadLeagueBackup, readLeagueBackup } from './client-io';
+import { pointsValue, readDraft, setFormat, syncDraft } from './draft-form';
+import {
+  createLeagueRecord,
+  generateSchedule,
+  parseScore,
+  type LeagueLibrary,
+  type LeagueRecord,
+  type LeagueSchedule,
+} from './logic';
+import { importSharedLeague } from './sharing';
+import { loadLeagueLibrary, saveLeagueLibrary } from './storage';
+import type { RoundRobinLeagueManagerUI } from './ui';
+
+interface AppState {
+  library: LeagueLibrary;
+  active: LeagueRecord | null;
+  schedule: LeagueSchedule | null;
+}
+
+type ClickHandler = (button: HTMLButtonElement) => void;
+
+function query<T extends Element>(root: HTMLElement, selector: string): T {
+  const node = root.querySelector<T>(selector);
+  if (!node) throw new Error(`Missing element: ${selector}`);
+  return node;
+}
+
+function readUI(root: HTMLElement): RoundRobinLeagueManagerUI {
+  const script = query<HTMLScriptElement>(root, '[data-role="ui-json"]');
+  return JSON.parse(script.textContent ?? '{}') as RoundRobinLeagueManagerUI;
+}
+
+function upsertActive(state: AppState): void {
+  if (!state.active) return;
+  const index = state.library.leagues.findIndex((league) => league.id === state.active?.id);
+  if (index >= 0) state.library.leagues[index] = state.active;
+  else state.library.leagues.push(state.active);
+  state.library.activeLeagueId = state.active.id;
+  saveLeagueLibrary(state.library);
+}
+
+function setNotice(root: HTMLElement, message: string): void {
+  root.querySelectorAll<HTMLElement>('[data-role="notice"]').forEach((notice) => {
+    notice.textContent = message;
+  });
+}
+
+function showLibrary(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI): void {
+  query<HTMLElement>(root, '[data-view="library"]').hidden = false;
+  query<HTMLElement>(root, '[data-view="manager"]').hidden = true;
+  state.active = null;
+  state.schedule = null;
+  renderLibrary(root, state.library, ui);
+}
+
+function startNewLeague(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI): void {
+  showLibrary(root, state, ui);
+  query<HTMLInputElement>(root, '[data-role="league-name"]').focus();
+}
+
+function openLeague(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI, id: string): void {
+  const record = state.library.leagues.find((league) => league.id === id);
+  if (!record) return;
+  state.active = record;
+  state.schedule = generateSchedule(record.config);
+  record.selectedRound = Math.min(record.selectedRound, state.schedule.rounds.length - 1);
+  state.library.activeLeagueId = record.id;
+  saveLeagueLibrary(state.library);
+  query<HTMLElement>(root, '[data-view="library"]').hidden = true;
+  query<HTMLElement>(root, '[data-view="manager"]').hidden = false;
+  setTab(root, 'matches');
+  renderManager(root, record, state.schedule, ui);
+  renderSettings(root, record);
+}
+
+function createLeague(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI): void {
+  if (!syncDraft(root, ui)) return;
+  const now = new Date().toISOString();
+  const record = createLeagueRecord(readDraft(root), createClientId(), now);
+  state.library.leagues.push(record);
+  state.library.activeLeagueId = record.id;
+  saveLeagueLibrary(state.library);
+  query<HTMLFormElement>(root, '[data-role="create-form"]').reset();
+  setFormat(root, 'single');
+  openLeague(root, state, ui, record.id);
+}
+
+function setTab(root: HTMLElement, tab: string): void {
+  root.dataset.activeTab = tab;
+  root.querySelectorAll<HTMLButtonElement>('[data-action="set-tab"]').forEach((button) => {
+    button.setAttribute('aria-pressed', String(button.dataset.tab === tab));
+  });
+  root.querySelectorAll<HTMLElement>('[data-panel]').forEach((panel) => {
+    panel.hidden = panel.dataset.panel !== tab;
+  });
+}
+
+function selectRound(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI, index: number): void {
+  if (!state.active || !state.schedule) return;
+  const bounded = Math.max(0, Math.min(index, state.schedule.rounds.length - 1));
+  state.active.selectedRound = bounded;
+  state.active.updatedAt = new Date().toISOString();
+  upsertActive(state);
+  renderManager(root, state.active, state.schedule, ui);
+}
+
+function changeRound(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI, delta: number): void {
+  if (!state.active) return;
+  selectRound(root, state, ui, state.active.selectedRound + delta);
+}
+
+async function shareRecord(root: HTMLElement, record: LeagueRecord, ui: RoundRobinLeagueManagerUI): Promise<void> {
+  const copied = await copyLeagueLink(record);
+  setNotice(root, copied ? ui.copiedLeague : ui.copyFailed);
+}
+
+function deleteLeague(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI, id: string): void {
+  if (!window.confirm(ui.confirmDelete)) return;
+  state.library.leagues = state.library.leagues.filter((league) => league.id !== id);
+  if (state.library.activeLeagueId === id) state.library.activeLeagueId = null;
+  saveLeagueLibrary(state.library);
+  showLibrary(root, state, ui);
+}
+
+function updateResult(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI, input: HTMLInputElement): void {
+  if (!state.active || !state.schedule) return;
+  const matchId = input.dataset.matchId;
+  const side = input.dataset.side as 'home' | 'away' | undefined;
+  if (!matchId || !side) return;
+  const current = state.active.results[matchId] ?? { home: null, away: null };
+  state.active.results[matchId] = { ...current, [side]: parseScore(input.value) };
+  state.active.updatedAt = new Date().toISOString();
+  upsertActive(state);
+  renderMatchStatus(input, state.active.results[matchId], ui);
+  renderLiveData(root, state.active, state.schedule, ui);
+}
+
+function saveSettings(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI): void {
+  if (!state.active || !state.schedule) return;
+  const name = query<HTMLInputElement>(root, '[data-role="settings-name"]').value.trim();
+  if (!name) return;
+  state.active.config.name = name;
+  state.active.config.scoring = {
+    win: pointsValue(root, 'settings-win', state.active.config.scoring.win),
+    draw: pointsValue(root, 'settings-draw', state.active.config.scoring.draw),
+    loss: pointsValue(root, 'settings-loss', state.active.config.scoring.loss),
+  };
+  state.active.updatedAt = new Date().toISOString();
+  upsertActive(state);
+  renderManager(root, state.active, state.schedule, ui);
+  setNotice(root, ui.settingsSaved);
+}
+
+function loadExample(root: HTMLElement, ui: RoundRobinLeagueManagerUI): void {
+  query<HTMLInputElement>(root, '[data-role="league-name"]').value = ui.demoLeagueName;
+  query<HTMLTextAreaElement>(root, '[data-role="teams"]').value = ui.demoTeams;
+  syncDraft(root, ui);
+}
+
+async function importFile(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI, file: File): Promise<void> {
+  const parsed = await readLeagueBackup(file);
+  if (parsed) {
+    const now = new Date().toISOString();
+    const record = { ...parsed, id: createClientId(), createdAt: now, updatedAt: now };
+    state.library.leagues.push(record);
+    saveLeagueLibrary(state.library);
+    openLeague(root, state, ui, record.id);
+    setNotice(root, ui.importedLeague);
+  } else {
+    showLibrary(root, state, ui);
+    setNotice(root, ui.importFailed);
+  }
+}
+
+function handlers(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI): Record<string, ClickHandler> {
+  return {
+    'show-library': () => showLibrary(root, state, ui),
+    'new-league': () => startNewLeague(root, state, ui),
+    'load-example': () => loadExample(root, ui),
+    'open-league': (button) => openLeague(root, state, ui, button.dataset.leagueId ?? ''),
+    'select-round': (button) => selectRound(root, state, ui, Number(button.dataset.round)),
+    'previous-round': () => changeRound(root, state, ui, -1),
+    'next-round': () => changeRound(root, state, ui, 1),
+    'set-tab': (button) => setTab(root, button.dataset.tab ?? 'matches'),
+    'share-active': () => { if (state.active) void shareRecord(root, state.active, ui); },
+    'download-active': () => {
+      if (!state.active) return;
+      downloadLeagueBackup(state.active);
+      setNotice(root, ui.downloadedLeague);
+    },
+    'delete-active': () => { if (state.active) deleteLeague(root, state, ui, state.active.id); },
+    'delete-library-league': (button) => deleteLeague(root, state, ui, button.dataset.leagueId ?? ''),
+    'share-library-league': (button) => { const record = state.library.leagues.find((league) => league.id === button.dataset.leagueId); if (record) void shareRecord(root, record, ui); },
+    'save-settings': () => saveSettings(root, state, ui),
+  };
+}
+
+function bindEvents(root: HTMLElement, state: AppState, ui: RoundRobinLeagueManagerUI): void {
+  const clickHandlers = handlers(root, state, ui);
+  root.addEventListener('click', (event) => {
+    const button = (event.target as Element).closest<HTMLButtonElement>('[data-action]');
+    if (button?.dataset.action) clickHandlers[button.dataset.action]?.(button);
+  });
+  root.addEventListener('input', (event) => {
+    const input = event.target as HTMLInputElement;
+    if (input.dataset.matchId) updateResult(root, state, ui, input);
+    else if (input.closest('[data-role="create-form"]')) syncDraft(root, ui);
+  });
+  root.querySelectorAll<HTMLButtonElement>('[data-format]').forEach((button) => button.addEventListener('click', () => {
+    setFormat(root, button.dataset.format === 'double' ? 'double' : 'single');
+    syncDraft(root, ui);
+  }));
+}
+
+export function initRoundRobinLeagueManager(root: HTMLElement): void {
+  const ui = readUI(root);
+  const state: AppState = { library: loadLeagueLibrary(), active: null, schedule: null };
+  bindEvents(root, state, ui);
+  query<HTMLFormElement>(root, '[data-role="create-form"]').addEventListener('submit', (event) => {
+    event.preventDefault();
+    createLeague(root, state, ui);
+  });
+  query<HTMLInputElement>(root, '[data-role="import-file"]').addEventListener('change', (event) => {
+    const file = (event.target as HTMLInputElement).files?.[0];
+    if (file) void importFile(root, state, ui, file);
+  });
+  const initialId = importSharedLeague(state.library, window.location.href, new Date().toISOString());
+  saveLeagueLibrary(state.library);
+  renderLibrary(root, state.library, ui);
+  if (initialId) openLeague(root, state, ui, initialId);
+  else syncDraft(root, ui);
+}