Page /stats — tableau de bord maître de l'écosystème (consolidation live des 12 plateformes) · 6f20265 · groupe-ka

Page /stats — tableau de bord maître de l'écosystème (consolidation live des 12 plateformes)

- src/lib/ecostats.ts : fetch serveur parallèle des 11 dashboards
  /api/stats/dashboard (contrat commun SPEC), revalidate 600 s, délai 8 s,
  null si échec ; helpers mainKpi/newKpi/topKpis/consolidate.
- /stats : sélecteur de période en liens ?period=… (auj → tout, défaut
  30j), boutons Rapport écosystème complet / Synthèse (PDF), bandeau KPI
  consolidés (volume agrégé, 12/12 en ligne, connecteurs, nouveautés),
  classement des plateformes par volume principal, bloc résumé par
  plateforme (pastille accent, 3 KPI, 1 record, lien /stats de la
  plateforme), note de méthode ; plateforme injoignable = carte grise
  « données indisponibles » — rien d'inventé, pas de section visites.
- /api/stats/ecosystem-report : proxy en streaming du PDF généré par
  API-KA (Content-Type et Content-Disposition conservés).
- layout : « Stats » dans la nav (avant Statut) + lien footer
  « Statistiques de l'écosystème ».
- src/ka/stats : kit stats ka-ui vendoré (SPEC.md, kacharts, kapdf).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Simon-Pierre Boucher committed 1 mo ago (Aug 18, 2026) parent aa26433

7 changed files +1,687 −0

added src/app/api/stats/ecosystem-report/route.ts +58 −0

		`@@ -0,0 +1,58 @@`
	1	+// Auteur : Simon-Pierre Boucher — contact@spboucher.ai
	2	+// /api/stats/ecosystem-report — proxy en streaming du rapport écosystème PDF
	3	+// généré par API-KA (GET https://www.api-ka.com/api/stats/ecosystem-report).
	4	+// Conserve Content-Type et Content-Disposition (filename
	5	+// groupe-ka_ecosysteme_stats_<periode>_<date>.pdf) ; API-KA garde son propre
	6	+// cache de 10 minutes par (period, mode).
	7	+import { NextRequest, NextResponse } from "next/server";
	8	+
	9	+export const dynamic = "force-dynamic";
	10	+
	11	+const UPSTREAM = "https://www.api-ka.com/api/stats/ecosystem-report";
	12	+const PERIODS = new Set(["auj", "7j", "30j", "3m", "6m", "12m", "annee", "tout"]);
	13	+const MODES = new Set(["complet", "synthese"]);
	14	+
	15	+export async function GET(req: NextRequest) {
	16	+ const sp = req.nextUrl.searchParams;
	17	+ const period = sp.get("period") ?? "30j";
	18	+ const mode = sp.get("mode") ?? "complet";
	19	+ if (!PERIODS.has(period) \|\| !MODES.has(mode)) {
	20	+ return NextResponse.json(
	21	+ { error: "Paramètres invalides (period, mode)" },
	22	+ { status: 422 },
	23	+ );
	24	+ }
	25	+ let upstream: Response;
	26	+ try {
	27	+ upstream = await fetch(
	28	+ `${UPSTREAM}?period=${encodeURIComponent(period)}&mode=${encodeURIComponent(mode)}`,
	29	+ {
	30	+ cache: "no-store",
	31	+ signal: AbortSignal.timeout(60_000),
	32	+ headers: { accept: "application/pdf" },
	33	+ },
	34	+ );
	35	+ } catch {
	36	+ return NextResponse.json(
	37	+ { error: "API-KA injoignable — réessayez dans quelques instants" },
	38	+ { status: 502 },
	39	+ );
	40	+ }
	41	+ if (!upstream.ok \|\| !upstream.body) {
	42	+ return NextResponse.json(
	43	+ { error: `API-KA a répondu ${upstream.status}` },
	44	+ { status: 502 },
	45	+ );
	46	+ }
	47	+ return new Response(upstream.body, {
	48	+ status: 200,
	49	+ headers: {
	50	+ "content-type":
	51	+ upstream.headers.get("content-type") ?? "application/pdf",
	52	+ "content-disposition":
	53	+ upstream.headers.get("content-disposition") ??
	54	+ `attachment; filename="groupe-ka_ecosysteme_stats_${period}.pdf"`,
	55	+ "cache-control": "no-store",
	56	+ },
	57	+ });
	58	+}

modified src/app/layout.tsx +5 −0

		`@@ -49,6 +49,7 @@ const NAV_ITEMS = [`
49	49	{ href: "/#produits", label: "Plateformes" },
50	50	{ href: "/#socle", label: "Socle" },
51	51	{ href: "/#bots", label: "Bots" },
	52	+ { href: "/stats", label: "Stats" },
52	53	{ href: "/status", label: "Statut" },
53	54	{ href: "/#contact", label: "Contact" },
54	55	];
		`@@ -309,6 +310,10 @@ export default async function RootLayout({`
309	310	Transparence des robots d'indexation
310	311	</a>{" "}
311	312	·{" "}
	313	+ <a href="/stats" className="underline-offset-4 hover:text-lime hover:underline">
	314	+ Statistiques de l'écosystème
	315	+ </a>{" "}
	316	+ ·{" "}
312	317	<a href="/status" className="underline-offset-4 hover:text-lime hover:underline">
313	318	État des services
314	319	</a>{" "}

added src/app/stats/page.tsx +381 −0

		`@@ -0,0 +1,381 @@`
	1	+// Auteur : Simon-Pierre Boucher — contact@spboucher.ai
	2	+// /stats — tableau de bord maître de l'écosystème Groupe KA : consolidation
	3	+// LIVE des tableaux de bord /api/stats/dashboard des 11 plateformes de
	4	+// données (src/lib/ecostats.ts, cache 10 min), classement, bloc résumé par
	5	+// plateforme, rapport écosystème PDF (proxy API-KA). Aucune donnée inventée :
	6	+// une plateforme injoignable = carte « indisponible » grise.
	7	+import type { Metadata } from "next";
	8	+import { fmtInt, getLiveMetrics } from "@/lib/live";
	9	+import {
	10	+ PERIODS,
	11	+ type Kpi,
	12	+ type PeriodKey,
	13	+ type PlatformStats,
	14	+ consolidate,
	15	+ getEcosystemStats,
	16	+ isPeriod,
	17	+ mainKpi,
	18	+ newKpi,
	19	+ topKpis,
	20	+} from "@/lib/ecostats";
	21	+
	22	+export const metadata: Metadata = {
	23	+ title: "Statistiques de l'écosystème — Groupe KA",
	24	+ description:
	25	+ "Tableau de bord maître du Groupe KA : indicateurs consolidés en direct des 12 plateformes de l'écosystème ·Ka, classement par volume, résumé par plateforme et rapport écosystème PDF.",
	26	+};
	27	+
	28	+/** Format compact honnête pour les très grands nombres (G / M). */
	29	+function fmtVal(k: Kpi): string {
	30	+ const v = k.value;
	31	+ if (typeof v !== "number" \|\| !Number.isFinite(v)) return String(v);
	32	+ let txt: string;
	33	+ if (Math.abs(v) >= 1_000_000_000) {
	34	+ txt = `${(v / 1_000_000_000).toLocaleString("fr-CA", { maximumFractionDigits: 2 })} G`;
	35	+ } else if (Math.abs(v) >= 100_000_000) {
	36	+ txt = `${(v / 1_000_000).toLocaleString("fr-CA", { maximumFractionDigits: 1 })} M`;
	37	+ } else if (Number.isInteger(v)) {
	38	+ txt = fmtInt(v);
	39	+ } else {
	40	+ txt = v.toLocaleString("fr-CA", { maximumFractionDigits: 2 });
	41	+ }
	42	+ return k.unit ? `${txt} ${k.unit}` : txt;
	43	+}
	44	+
	45	+function Delta({ k }: { k: Kpi }) {
	46	+ if (typeof k.delta_pct !== "number") return null;
	47	+ const up = (k.direction ?? (k.delta_pct >= 0 ? "up" : "down")) === "up";
	48	+ return (
	49	+ <span
	50	+ className={`gk-mono text-[10.5px] font-bold ${up ? "text-green" : "text-danger"}`}
	51	+ >
	52	+ {k.delta_pct >= 0 ? "▲ +" : "▼ "}
	53	+ {k.delta_pct.toLocaleString("fr-CA")} %
	54	+ </span>
	55	+ );
	56	+}
	57	+
	58	+function Pastille({ accent }: { accent: string }) {
	59	+ return (
	60	+ <span
	61	+ aria-hidden="true"
	62	+ className="inline-block h-[10px] w-[10px] flex-none rounded-[3px] border border-ink"
	63	+ style={{ background: accent }}
	64	+ />
	65	+ );
	66	+}
	67	+
	68	+function PlatformCard({ p }: { p: PlatformStats }) {
	69	+ const { site, dash } = p;
	70	+ if (!dash) {
	71	+ return (
	72	+ <article className="gk-card flex flex-col bg-surface-2 p-5">
	73	+ <div className="flex items-center gap-2">
	74	+ <Pastille accent={site.accent} />
	75	+ <span className="gk-display truncate text-[17px] font-bold tracking-[-0.02em] text-ink-3">
	76	+ {site.wordmark}
	77	+ </span>
	78	+ </div>
	79	+ <p className="klabel mt-4">Données indisponibles</p>
	80	+ <p className="mt-2 text-[13px] text-ink-3">
	81	+ La plateforme n'a pas répondu au moment du chargement. Ses
	82	+ statistiques restent consultables directement sur son site.
	83	+ </p>
	84	+ <a
	85	+ href={`https://${site.domain}/stats`}
	86	+ target="_blank"
	87	+ rel="noopener noreferrer"
	88	+ className="gk-mono mt-auto pt-4 text-[11.5px] font-bold text-ink-3 underline-offset-4 hover:text-ink hover:underline"
	89	+ >
	90	+ Stats détaillées →
	91	+ </a>
	92	+ </article>
	93	+ );
	94	+ }
	95	+ const kpis = topKpis(dash, 3);
	96	+ const record = dash.records?.[0] ?? null;
	97	+ return (
	98	+ <article className="gk-card flex flex-col p-5">
	99	+ <div className="flex flex-wrap items-center justify-between gap-x-3 gap-y-1">
	100	+ <span className="flex min-w-0 items-center gap-2">
	101	+ <Pastille accent={site.accent} />
	102	+ <span className="gk-display truncate text-[17px] font-bold tracking-[-0.02em]">
	103	+ {site.wordmark}
	104	+ </span>
	105	+ </span>
	106	+ <a
	107	+ href={`https://${site.domain}`}
	108	+ target="_blank"
	109	+ rel="noopener noreferrer"
	110	+ className="gk-mono text-[10.5px] font-bold text-ink-3 underline-offset-4 hover:text-ink hover:underline"
	111	+ >
	112	+ {site.domain}
	113	+ </a>
	114	+ </div>
	115	+ <dl className="mt-4 space-y-3">
	116	+ {kpis.map((k) => (
	117	+ <div
	118	+ key={k.id ?? k.label}
	119	+ className="flex items-baseline justify-between gap-3 border-b border-dashed border-[rgba(20,24,20,0.18)] pb-2"
	120	+ >
	121	+ <dt className="min-w-0 text-[12px] leading-snug text-ink-2">
	122	+ {k.label}
	123	+ </dt>
	124	+ <dd className="flex flex-none items-baseline gap-2">
	125	+ <span className="gk-mono text-[15px] font-bold tracking-[-0.01em] whitespace-nowrap">
	126	+ {fmtVal(k)}
	127	+ </span>
	128	+ <Delta k={k} />
	129	+ </dd>
	130	+ </div>
	131	+ ))}
	132	+ </dl>
	133	+ {record ? (
	134	+ <p className="mt-3 rounded-md bg-lime-soft px-3 py-2 text-[12px] leading-snug">
	135	+ <span className="gk-mono text-[10px] font-bold tracking-[0.08em] text-green uppercase">
	136	+ Record ·{" "}
	137	+ </span>
	138	+ {record.label} : <strong>{record.value}</strong>
	139	+ {record.date ? (
	140	+ <span className="text-ink-3"> ({record.date})</span>
	141	+ ) : null}
	142	+ </p>
	143	+ ) : null}
	144	+ <a
	145	+ href={`https://${site.domain}/stats`}
	146	+ target="_blank"
	147	+ rel="noopener noreferrer"
	148	+ className="gk-mono mt-auto pt-4 text-[11.5px] font-bold text-green underline-offset-4 hover:text-ink hover:underline"
	149	+ >
	150	+ Stats détaillées → {site.domain}/stats
	151	+ </a>
	152	+ </article>
	153	+ );
	154	+}
	155	+
	156	+export default async function StatsPage({
	157	+ searchParams,
	158	+}: {
	159	+ searchParams: Promise<{ period?: string }>;
	160	+}) {
	161	+ const sp = await searchParams;
	162	+ const period: PeriodKey = isPeriod(sp.period) ? sp.period : "30j";
	163	+ const [platforms, live] = await Promise.all([
	164	+ getEcosystemStats(period),
	165	+ getLiveMetrics(),
	166	+ ]);
	167	+ const c = consolidate(platforms);
	168	+ const periodLabel =
	169	+ platforms.find((p) => p.dash?.period?.label)?.dash?.period?.label ??
	170	+ (PERIODS.find(([k]) => k === period)?.[1] ?? period);
	171	+ const freshness = c.latestUpdate
	172	+ ? new Date(c.latestUpdate).toLocaleString("fr-CA", {
	173	+ timeZone: "America/Toronto",
	174	+ dateStyle: "long",
	175	+ timeStyle: "short",
	176	+ })
	177	+ : null;
	178	+ const reportHref = (mode: "complet" \| "synthese") =>
	179	+ `/api/stats/ecosystem-report?period=${period}&mode=${mode}`;
	180	+
	181	+ const banner: { label: string; value: string; note?: string }[] = [
	182	+ {
	183	+ label: "Volume principal agrégé",
	184	+ value: fmtInt(c.totalVolume),
	185	+ note: `somme des indicateurs principaux des ${c.reachable} plateformes jointes`,
	186	+ },
	187	+ {
	188	+ label: "Plateformes en ligne",
	189	+ value: `${c.reachable + 1}/12`,
	190	+ note: "11 plateformes de données + le hub groupe-ka.com",
	191	+ },
	192	+ {
	193	+ label: "Connecteurs totaux",
	194	+ value: `${fmtInt(live.totals.connectors)}+`,
	195	+ note: "connecteurs sources actifs sur l'écosystème",
	196	+ },
	197	+ ...(c.newCount > 0
	198	+ ? [
	199	+ {
	200	+ label: "Nouveautés de la période",
	201	+ value: fmtInt(c.totalNew),
	202	+ note: `${c.newCount} plateformes qui les mesurent`,
	203	+ },
	204	+ ]
	205	+ : []),
	206	+ ];
	207	+
	208	+ return (
	209	+ <main className="mx-auto max-w-6xl px-4 py-12 sm:px-6">
	210	+ {/* 1 — en-tête : titre, rapports PDF, fraîcheur, période */}
	211	+ <p className="kicker">Tableau de bord maître · les 12 plateformes</p>
	212	+ <h1 className="gk-display mt-3 text-[clamp(28px,4.5vw,44px)] leading-[1.02] font-bold tracking-[-0.035em] uppercase">
	213	+ Statistiques de <span className="hl">l'écosystème</span>
	214	+ </h1>
	215	+ <p className="mt-4 max-w-2xl text-[14.5px] text-ink-2">
	216	+ Chaque plateforme ·Ka expose son tableau de bord statistique ; cette
	217	+ page les consolide en direct — période affichée :{" "}
	218	+ <strong>{periodLabel}</strong>. Rien d'inventé : chaque chiffre
	219	+ vient de la plateforme qui le mesure.
	220	+ </p>
	221	+ <div className="mt-6 flex flex-wrap items-center gap-3">
	222	+ <a href={reportHref("complet")} className="btn btn-primary">
	223	+ Rapport écosystème complet (PDF)
	224	+ </a>
	225	+ <a href={reportHref("synthese")} className="btn btn-ghost">
	226	+ Synthèse (PDF)
	227	+ </a>
	228	+ </div>
	229	+ <p className="gk-mono mt-3 text-[11px] text-ink-3">
	230	+ {freshness
	231	+ ? `Données mises à jour le ${freshness} (heure de l'Est) · cache 10 min`
	232	+ : "Fraîcheur inconnue — aucune plateforme jointe pour le moment"}
	233	+ </p>
	234	+
	235	+ {/* sélecteur de période : simples liens ?period=… */}
	236	+ <nav aria-label="Période" className="mt-6 flex flex-wrap gap-2">
	237	+ {PERIODS.map(([key, label]) => (
	238	+ <a
	239	+ key={key}
	240	+ href={`/stats?period=${key}`}
	241	+ aria-current={key === period ? "page" : undefined}
	242	+ className={`stat-chip !py-[6px] transition-colors ${
	243	+ key === period
	244	+ ? "!bg-ink !text-lime"
	245	+ : "hover:!bg-lime-soft"
	246	+ }`}
	247	+ >
	248	+ {label}
	249	+ </a>
	250	+ ))}
	251	+ </nav>
	252	+
	253	+ {/* 2 — bandeau KPI consolidés */}
	254	+ <section className="mt-8 grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
	255	+ {banner.map((b) => (
	256	+ <div key={b.label} className="gk-card p-5">
	257	+ <p className="gk-display text-[26px] leading-none font-bold tracking-[-0.02em]">
	258	+ {b.value}
	259	+ </p>
	260	+ <p className="klabel mt-2">{b.label}</p>
	261	+ {b.note ? (
	262	+ <p className="mt-1 text-[11.5px] leading-snug text-ink-3">
	263	+ {b.note}
	264	+ </p>
	265	+ ) : null}
	266	+ </div>
	267	+ ))}
	268	+ </section>
	269	+
	270	+ {/* 3 — classement des plateformes */}
	271	+ <section className="mt-14">
	272	+ <p className="kicker">Classement · volume principal</p>
	273	+ <h2 className="gk-display mt-3 text-[clamp(22px,3vw,30px)] font-bold tracking-[-0.03em]">
	274	+ Les plateformes, par volume
	275	+ </h2>
	276	+ <div className="gk-card mt-5 overflow-x-auto">
	277	+ <table className="w-full min-w-[640px] border-collapse text-[13px]">
	278	+ <thead>
	279	+ <tr className="bg-ink text-left text-paper">
	280	+ {[
	281	+ "#",
	282	+ "Plateforme",
	283	+ "Indicateur principal",
	284	+ "Volume",
	285	+ "Nouveautés (période)",
	286	+ "",
	287	+ ].map((h, i) => (
	288	+ <th
	289	+ key={i}
	290	+ className="gk-mono px-4 py-3 text-[10.5px] font-bold tracking-[0.08em] whitespace-nowrap uppercase"
	291	+ >
	292	+ {h}
	293	+ </th>
	294	+ ))}
	295	+ </tr>
	296	+ </thead>
	297	+ <tbody>
	298	+ {c.ranked.map((p, i) => {
	299	+ const mk = mainKpi(p.dash);
	300	+ const nk = newKpi(p.dash);
	301	+ return (
	302	+ <tr
	303	+ key={p.site.id}
	304	+ className={`border-t border-[rgba(20,24,20,0.12)] ${
	305	+ i % 2 ? "bg-surface-2" : ""
	306	+ } ${p.dash ? "" : "text-ink-3"}`}
	307	+ >
	308	+ <td className="gk-mono px-4 py-3 text-[11.5px] font-bold">
	309	+ {i + 1}
	310	+ </td>
	311	+ <td className="px-4 py-3">
	312	+ <span className="flex items-center gap-2">
	313	+ <Pastille accent={p.site.accent} />
	314	+ <span className="gk-display font-bold whitespace-nowrap">
	315	+ {p.site.wordmark}
	316	+ </span>
	317	+ </span>
	318	+ </td>
	319	+ <td className="px-4 py-3 text-ink-2">
	320	+ {p.dash
	321	+ ? (mk?.label ?? "—")
	322	+ : "données indisponibles"}
	323	+ </td>
	324	+ <td className="gk-mono px-4 py-3 font-bold whitespace-nowrap">
	325	+ {mk ? fmtVal(mk) : "—"}
	326	+ </td>
	327	+ <td className="gk-mono px-4 py-3 whitespace-nowrap">
	328	+ {nk && typeof nk.value === "number"
	329	+ ? fmtInt(nk.value)
	330	+ : "—"}
	331	+ </td>
	332	+ <td className="px-4 py-3">
	333	+ <a
	334	+ href={`https://${p.site.domain}/stats`}
	335	+ target="_blank"
	336	+ rel="noopener noreferrer"
	337	+ className="gk-mono text-[11px] font-bold text-green underline-offset-4 hover:underline"
	338	+ >
	339	+ Stats →
	340	+ </a>
	341	+ </td>
	342	+ </tr>
	343	+ );
	344	+ })}
	345	+ </tbody>
	346	+ </table>
	347	+ </div>
	348	+ <p className="mt-3 max-w-3xl text-[12px] leading-relaxed text-ink-3">
	349	+ Le « volume principal » est le premier indicateur du tableau de bord
	350	+ de chaque plateforme (annonces actives, véhicules, produits, pages
	351	+ indexées…). Les volumes ne sont pas de même nature : le classement
	352	+ donne un ordre de grandeur, pas une comparaison homogène.
	353	+ </p>
	354	+ </section>
	355	+
	356	+ {/* 4 — un bloc résumé par plateforme */}
	357	+ <section className="mt-14">
	358	+ <p className="kicker">Plateforme par plateforme</p>
	359	+ <h2 className="gk-display mt-3 text-[clamp(22px,3vw,30px)] font-bold tracking-[-0.03em]">
	360	+ Le résumé de chacune
	361	+ </h2>
	362	+ <div className="mt-5 grid gap-5 sm:grid-cols-2 lg:grid-cols-3">
	363	+ {c.ranked.map((p) => (
	364	+ <PlatformCard key={p.site.id} p={p} />
	365	+ ))}
	366	+ </div>
	367	+ </section>
	368	+
	369	+ {/* 5 — note de méthode */}
	370	+ <p className="gk-mono mt-12 text-[11px] leading-relaxed text-ink-3">
	371	+ Méthode : les chiffres sont lus en direct sur le tableau de bord
	372	+ statistique de chaque plateforme (endpoint commun
	373	+ /api/stats/dashboard, délai 8 s), avec un cache serveur de 10 minutes
	374	+ par période. Le rapport écosystème PDF est généré par API-KA à partir
	375	+ des mêmes données. Une plateforme qui ne répond pas est affichée «
	376	+ indisponible » — jamais remplacée par un chiffre inventé. Aucune
	377	+ statistique de visites : nous ne mesurons pas votre navigation.
	378	+ </p>
	379	+ </main>
	380	+ );
	381	+}

added src/ka/stats/SPEC.md +123 −0

		`@@ -0,0 +1,123 @@`
	1	+# ka-stats — module Stats commun Groupe KA (spec v1)
	2	+
	3	+Contrat partagé par les 12 plateformes pour leurs pages /stats (tableau de
	4	+bord analytique) et l'export PDF estampillé Groupe-KA. Le visuel suit le
	5	+design system ka-ui (tokens.css) avec l'accent de la marque.
	6	+
	7	+## 1. Page /stats — structure obligatoire (dans cet ordre)
	8	+
	9	+1. Bandeau KPI : 4–6 grandes cartes (`KpiCard`) — valeur, libellé,
	10	+ variation vs période précédente (▲/▼ + %, vert `--green` / rouge `--danger`).
	11	+2. Sélecteur de période global (`PeriodSelector`) : `aujourd'hui · 7 j ·
	12	+ 30 j · 3 m · 6 m · 12 m · année en cours · tout` + plage personnalisée
	13	+ (2 champs date). Toute la page se recalcule (state → refetch dashboard).
	14	+3. Graphiques : courbes d'évolution (`LineChart`, survol = infobulle,
	15	+ légende cliquable pour masquer une série, comparaison N vs N-1 en
	16	+ pointillé), barres (`BarChart`), anneaux (`Donut`), calendrier de chaleur
	17	+ (`CalendarHeatmap`) quand pertinent.
	18	+4. Répartition géographique (par ville/région) quand pertinent — barres
	19	+ horizontales triées (pas besoin de vraie carte).
	20	+5. Tableaux détaillés (`DataTable`) : tri par colonne, recherche interne,
	21	+ pagination (25/pg), débordement horizontal propre sur mobile (.tbl-wrap).
	22	+6. Records & faits marquants : générés depuis les données (jour record,
	23	+ plus forte croissance, meilleure entrée…) — cartes compactes.
	24	+7. Fraîcheur : « Mis à jour le {date heure} » + bouton Rafraîchir.
	25	+8. Bouton PDF bien visible en haut : « Télécharger le rapport PDF » avec
	26	+ deux choix (Rapport complet / Synthèse 2 pages). Indicateur de progression
	27	+ si > 2 s.
	28	+
	29	+Responsive : KPI empilés < 768 px, graphiques pleine largeur redimensionnés
	30	+(SVG viewBox), tableaux en défilement horizontal contenu, tactile ≥ 44 px.
	31	+AUCUNE donnée inventée : une stat indisponible = bloc « Pas encore mesuré »
	32	+(carte grise propre), jamais un faux chiffre.
	33	+
	34	+## 2. API — contrat commun
	35	+
	36	+`GET /api/stats/dashboard?period=7j\|30j\|3m\|6m\|12m\|annee\|tout\|auj&from=YYYY-MM-DD&to=YYYY-MM-DD`
	37	+
	38	+```jsonc
	39	+{
	40	+ "updated": "2026-08-17T21:04:00-04:00",
	41	+ "period": { "from": "2026-07-18", "to": "2026-08-17", "label": "30 jours" },
	42	+ "kpis": [ { "id": "total", "label": "Annonces actives", "value": 33744,
	43	+ "unit": "", "delta_pct": 4.2, "direction": "up" } ],
	44	+ "series": [ { "id": "vol", "title": "Annonces actives par jour", "unit": "annonces",
	45	+ "kind": "line", "points": [{ "t": "2026-07-18", "v": 31200 }],
	46	+ "compare": [{ "t": "2025-07-18", "v": 24100 }] } ],
	47	+ "breakdowns": [ { "id": "types", "title": "Par type", "kind": "donut",
	48	+ "items": [{ "label": "4½", "value": 9120 }] } ],
	49	+ "geo": { "title": "Par région", "items": [{ "label": "Montréal", "value": 15680 }] },
	50	+ "heatmap": { "title": "Activité", "cells": [{ "date": "2026-08-01", "value": 210 }] },
	51	+ "tables": [ { "id": "top", "title": "Top villes", "columns": ["Ville", "Annonces", "Δ 30 j"],
	52	+ "rows": [["Montréal", 15680, "+3,1 %"]] } ],
	53	+ "records": [ { "label": "Jour record d'ajouts", "value": "412 annonces", "date": "2026-08-09" } ]
	54	+}
	55	+```
	56	+
	57	+Champs absents = section masquée. Cache serveur recommandé (≥ 5 min par
	58	+période). Les valeurs proviennent des données réelles (DB de la plateforme,
	59	+journaux de sync des connecteurs, /api/v1/runs d'API-KA…).
	60	+
	61	+`GET /api/stats/report?period=…&from=&to=&mode=complet\|synthese`
	62	+→ `application/pdf`, en-tête `Content-Disposition: attachment; filename=
	63	+groupe-ka_<plateforme>_stats_<periode>_<YYYY-MM-DD>.pdf`.
	64	+
	65	+## 3. PDF — gabarit Groupe-KA (implémentations : `kapdf.py` fpdf2 pour les
	66	+apps Python ; les apps Next portent le même gabarit en pdfkit)
	67	+
	68	+- Couverture : cadre encre, kicker « GROUPE KA · RAPPORT STATISTIQUE »,
	69	+ wordmark de la plateforme (boîte encre + accent), sous-titre, période
	70	+ couverte, date/heure de génération, bande encre au pied avec
	71	+ « par Groupe KA — groupe-ka.com ».
	72	+- Sommaire avec numéros de pages (mode complet).
	73	+- KPI : grille de cartes (bordure encre, valeur en gros, delta coloré).
	74	+- Graphiques VECTORIELS (dessinés en primitives, jamais de capture) :
	75	+ courbes, barres, anneaux — accent de la plateforme, axes/graduations encre.
	76	+- Tableaux paginés proprement (lignes zébrées `--surface-2`, jamais
	77	+ coupés en deux à cheval sur une ligne).
	78	+- Records puis page de fin : coordonnées Groupe KA (3 courriels +
	79	+ rôles d'ecosystem.json, groupe-ka.com), avertissement d'agrégateur,
	80	+ mentions légales courtes.
	81	+- Chaque page : en-tête discret (« Groupe KA · {Plateforme} », filet
	82	+ encre) + pied (« © Groupe-KA — {année} — groupe-ka.com · {période} · p. X/Y »).
	83	+- A4 portrait, marges 18 mm, typo : Helvetica (fallback sûr) ou fonts TTF du
	84	+ DS si présentes. Mode « synthese » = couverture + 1 page KPI/records.
	85	+
	86	+## 4. Spécifique par plateforme (sections métier attendues)
	87	+
	88	+- groupe-ka : tableau de bord maître — consolidation des 12 (volume total,
	89	+ croissance), classement des plateformes, bloc résumé par plateforme + lien
	90	+ vers sa page /stats ; « Rapport écosystème complet » = PDF consolidé.
	91	+- lou-ka : annonces actives/nouvelles/retirées, loyers moyens/médians par
	92	+ ville & taille, évolution, répartition par type, top villes.
	93	+- immo-ka : annonces actives/nouvelles/vendues-retirées, prix moyen/médian
	94	+ par ville/région/type, délai de présence, top villes, tension du marché.
	95	+- vrai-prix : couverture du rôle (unités, valeur totale), estimations
	96	+ servies si journalisées, répartitions par municipalité/type, indices marché.
	97	+- auto-ka : volume par marque/modèle/année/carburant/boîte, prix moyens et
	98	+ km moyens par segment, top marques/modèles.
	99	+- fabri-ka : produits par catégorie/région/boutique, fourchettes de prix,
	100	+ nouveautés par période, top catégories.
	101	+- food-ka : produits suivis, relevés de prix, soldes détectés (baisses/
	102	+ hausses, amplitude), top produits en solde, prix moyens par catégorie.
	103	+- resto-ka : restos par cuisine/ville/gamme, menus & plats, nouveautés/
	104	+ fermetures détectées, top établissements.
	105	+- sorti-ka : événements à venir/passés par catégorie/ville, gratuits vs
	106	+ payants, heatmap calendrier, top lieux.
	107	+- crea-ka : créateurs par plateforme/niche/tier, comptes reliés, top
	108	+ créateurs, croissance du répertoire.
	109	+- trouve-ka : pages indexées, domaines, rythme de crawl (indexées/h),
	110	+ erreurs, file frontier, tendances si les requêtes sont journalisées.
	111	+- api-ka : appels par endpoint/jour/heure, latences moyennes + p95, taux
	112	+ d'erreur, top endpoints, uptime (données des middlewares de logging + runs).
	113	+- Transverse (tous) : volume total agrégé + croissance, connecteurs actifs
	114	+ et éléments ajoutés/mis à jour par période (journaux de sync), complétude/
	115	+ fraîcheur moyenne des fiches quand mesurable. Trafic web : seulement si des
	116	+ journaux d'accès existent — sinon état vide propre.
	117	+
	118	+## 5. Ajouter une métrique / un graphique / une plateforme
	119	+
	120	+1 métrique = 1 entrée `kpis[]` ou `series[]` côté API (requête SQL agrégée +
	121	+cache) — le front la rend automatiquement. 1 plateforme = implémenter les 2
	122	+endpoints du contrat + une page /stats montée sur les composants du kit +
	123	+`kapdf.py` (ou gabarit pdfkit) branché sur le même JSON de dashboard.

added src/ka/stats/kacharts.tsx +389 −0

		`@@ -0,0 +1,389 @@`
	1	+// Auteur : Simon-Pierre Boucher — contact@spboucher.ai
	2	+// ka-ui/stats/kacharts.tsx — kit de graphiques SVG du module Stats commun
	3	+// Groupe KA (zéro dépendance, React 18+). Style : design system ka-ui
	4	+// (bordures encre, accent de la plateforme via var(--accent)).
	5	+// Composants : KpiCard, PeriodSelector, LineChart (infobulle + légende
	6	+// cliquable + comparaison N-1), BarChart, Donut, CalendarHeatmap, DataTable
	7	+// (tri/recherche/pagination), RecordCard, PdfButton, EmptyBlock, Fraicheur.
	8	+import { useMemo, useState } from "react";
	9	+
	10	+/* ---------- types (contrat SPEC.md) ---------- */
	11	+export type Kpi = {
	12	+ id: string; label: string; value: number \| string; unit?: string;
	13	+ delta_pct?: number \| null; direction?: "up" \| "down";
	14	+};
	15	+export type Point = { t: string; v: number };
	16	+export type Serie = {
	17	+ id: string; title: string; unit?: string; kind?: "line" \| "bar";
	18	+ points: Point[]; compare?: Point[];
	19	+};
	20	+export type BreakItem = { label: string; value: number };
	21	+export type TableSpec = { id: string; title: string; columns: string[]; rows: (string \| number)[][] };
	22	+export type RecordFact = { label: string; value: string; date?: string };
	23	+
	24	+export const PERIODS: { id: string; label: string }[] = [
	25	+ { id: "auj", label: "Aujourd'hui" },
	26	+ { id: "7j", label: "7 jours" },
	27	+ { id: "30j", label: "30 jours" },
	28	+ { id: "3m", label: "3 mois" },
	29	+ { id: "6m", label: "6 mois" },
	30	+ { id: "12m", label: "12 mois" },
	31	+ { id: "annee", label: "Année en cours" },
	32	+ { id: "tout", label: "Tout" },
	33	+];
	34	+
	35	+export const fmtInt = (n: number) => n.toLocaleString("fr-CA");
	36	+export const fmtNum = (n: number) =>
	37	+ Number.isInteger(n) ? fmtInt(n) : n.toLocaleString("fr-CA", { maximumFractionDigits: 2 });
	38	+
	39	+/* ---------- KPI ---------- */
	40	+export function KpiCard({ k }: { k: Kpi }) {
	41	+ const up = (k.direction ?? ((k.delta_pct ?? 0) >= 0 ? "up" : "down")) === "up";
	42	+ return (
	43	+ <article className="card" style={{ padding: "14px 16px", minWidth: 0 }}>
	44	+ <p style={{ margin: 0, fontFamily: "var(--font-display)", fontWeight: 700, fontSize: "clamp(22px,2.4vw,30px)", letterSpacing: "-0.02em" }}>
	45	+ {typeof k.value === "number" ? fmtNum(k.value) : k.value}
	46	+ {k.unit ? <span style={{ fontSize: "0.6em", color: "var(--ink-2)" }}> {k.unit}</span> : null}
	47	+ </p>
	48	+ <p className="klabel" style={{ margin: "6px 0 0" }}>{k.label}</p>
	49	+ {k.delta_pct !== undefined && k.delta_pct !== null && (
	50	+ <p style={{ margin: "8px 0 0", fontFamily: "var(--font-mono)", fontSize: 11, fontWeight: 700, color: up ? "var(--green)" : "var(--danger)" }}>
	51	+ {up ? "▲" : "▼"} {k.delta_pct >= 0 ? "+" : ""}{fmtNum(k.delta_pct)} % <span style={{ color: "var(--ink-3)", fontWeight: 500 }}>vs période préc.</span>
	52	+ </p>
	53	+ )}
	54	+ </article>
	55	+ );
	56	+}
	57	+
	58	+/* ---------- Sélecteur de période ---------- */
	59	+export function PeriodSelector({
	60	+ value, onChange, custom, onCustom,
	61	+}: {
	62	+ value: string; onChange: (p: string) => void;
	63	+ custom?: { from: string; to: string }; onCustom?: (from: string, to: string) => void;
	64	+}) {
	65	+ return (
	66	+ <div style={{ display: "flex", flexWrap: "wrap", gap: 8, alignItems: "center" }}>
	67	+ {PERIODS.map((p) => (
	68	+ <button key={p.id} type="button" onClick={() => onChange(p.id)}
	69	+ className="chip" aria-pressed={value === p.id}
	70	+ style={{ cursor: "pointer", minHeight: 44, background: value === p.id ? "var(--accent)" : "var(--surface)", color: value === p.id ? "var(--on-accent)" : "var(--ink)" }}>
	71	+ {p.label}
	72	+ </button>
	73	+ ))}
	74	+ {onCustom && (
	75	+ <span style={{ display: "inline-flex", gap: 6, alignItems: "center" }}>
	76	+ <input className="input" type="date" style={{ width: 150 }} value={custom?.from ?? ""} aria-label="Du"
	77	+ onChange={(e) => onCustom(e.target.value, custom?.to ?? "")} />
	78	+ <span className="klabel">au</span>
	79	+ <input className="input" type="date" style={{ width: 150 }} value={custom?.to ?? ""} aria-label="Au"
	80	+ onChange={(e) => onCustom(custom?.from ?? "", e.target.value)} />
	81	+ </span>
	82	+ )}
	83	+ </div>
	84	+ );
	85	+}
	86	+
	87	+/* ---------- Courbe ---------- */
	88	+export function LineChart({ serie, height = 240 }: { serie: Serie; height?: number }) {
	89	+ const [hide, setHide] = useState<{ cur: boolean; cmp: boolean }>({ cur: false, cmp: false });
	90	+ const [hover, setHover] = useState<number \| null>(null);
	91	+ const W = 720, H = height, PL = 54, PR = 10, PT = 14, PB = 26;
	92	+ const pts = serie.points ?? [];
	93	+ if (pts.length < 2) return <EmptyBlock title={serie.title} />;
	94	+ const all = [...(hide.cur ? [] : pts), ...(!hide.cmp && serie.compare ? serie.compare : [])];
	95	+ const vmax = Math.max(...all.map((p) => p.v), 1);
	96	+ const vmin = Math.min(0, ...all.map((p) => p.v));
	97	+ const X = (i: number, n: number) => PL + ((W - PL - PR) * i) / (n - 1);
	98	+ const Y = (v: number) => PT + (H - PT - PB) * (1 - (v - vmin) / (vmax - vmin \|\| 1));
	99	+ const path = (s: Point[]) => s.map((p, i) => `${i ? "L" : "M"}${X(i, s.length)},${Y(p.v)}`).join("");
	100	+ const hi = hover !== null ? Math.min(pts.length - 1, Math.max(0, hover)) : null;
	101	+ return (
	102	+ <figure className="card" style={{ margin: 0, padding: 16 }}>
	103	+ <figcaption style={{ display: "flex", justifyContent: "space-between", flexWrap: "wrap", gap: 8 }}>
	104	+ <b style={{ fontFamily: "var(--font-display)", fontSize: 15 }}>{serie.title}</b>
	105	+ <span style={{ display: "flex", gap: 10 }}>
	106	+ <LegendChip label="Période courante" color="var(--accent)" off={hide.cur} onClick={() => setHide((h) => ({ ...h, cur: !h.cur }))} />
	107	+ {serie.compare && <LegendChip label="Période comparée" color="var(--ink-3)" dashed off={hide.cmp} onClick={() => setHide((h) => ({ ...h, cmp: !h.cmp }))} />}
	108	+ </span>
	109	+ </figcaption>
	110	+ <svg viewBox={`0 0 ${W} ${H}`} style={{ width: "100%", height: "auto", marginTop: 10, touchAction: "pan-y" }} role="img" aria-label={serie.title}
	111	+ onMouseMove={(e) => {
	112	+ const r = (e.currentTarget as SVGSVGElement).getBoundingClientRect();
	113	+ const fx = ((e.clientX - r.left) / r.width) * W;
	114	+ setHover(Math.round(((fx - PL) / (W - PL - PR)) * (pts.length - 1)));
	115	+ }}
	116	+ onMouseLeave={() => setHover(null)}>
	117	+ {[0, 1, 2, 3, 4].map((g) => {
	118	+ const y = PT + ((H - PT - PB) * g) / 4;
	119	+ const v = vmax - ((vmax - vmin) * g) / 4;
	120	+ return (
	121	+ <g key={g}>
	122	+ <line x1={PL} x2={W - PR} y1={y} y2={y} stroke="var(--line)" strokeWidth={1} />
	123	+ <text x={PL - 6} y={y + 3} textAnchor="end" fontSize={10} fill="var(--ink-3)" fontFamily="var(--font-mono)">{fmtInt(Math.round(v))}</text>
	124	+ </g>
	125	+ );
	126	+ })}
	127	+ {[0, Math.floor(pts.length / 2), pts.length - 1].map((i) => (
	128	+ <text key={i} x={X(i, pts.length)} y={H - 8} textAnchor="middle" fontSize={10} fill="var(--ink-3)" fontFamily="var(--font-mono)">{pts[i].t}</text>
	129	+ ))}
	130	+ {!hide.cmp && serie.compare && serie.compare.length > 1 && (
	131	+ <path d={path(serie.compare)} fill="none" stroke="var(--ink-3)" strokeWidth={1.4} strokeDasharray="4 4" />
	132	+ )}
	133	+ {!hide.cur && <path d={path(pts)} fill="none" stroke="var(--accent)" strokeWidth={2.4} />}
	134	+ {hi !== null && (
	135	+ <g>
	136	+ <line x1={X(hi, pts.length)} x2={X(hi, pts.length)} y1={PT} y2={H - PB} stroke="var(--ink)" strokeWidth={1} strokeDasharray="2 3" />
	137	+ <circle cx={X(hi, pts.length)} cy={Y(pts[hi].v)} r={4} fill="var(--accent)" stroke="var(--ink)" strokeWidth={1.5} />
	138	+ </g>
	139	+ )}
	140	+ </svg>
	141	+ {hi !== null && (
	142	+ <p className="chip" style={{ marginTop: 8 }}>
	143	+ {pts[hi].t} — <b>{fmtNum(pts[hi].v)}{serie.unit ? ` ${serie.unit}` : ""}</b>
	144	+ {serie.compare?.[hi] && !hide.cmp ? <span style={{ color: "var(--ink-3)" }}> · N-1 : {fmtNum(serie.compare[hi].v)}</span> : null}
	145	+ </p>
	146	+ )}
	147	+ </figure>
	148	+ );
	149	+}
	150	+
	151	+function LegendChip({ label, color, off, dashed, onClick }: { label: string; color: string; off: boolean; dashed?: boolean; onClick: () => void }) {
	152	+ return (
	153	+ <button type="button" onClick={onClick} aria-pressed={!off}
	154	+ style={{ display: "inline-flex", alignItems: "center", gap: 6, border: 0, background: "none", cursor: "pointer", opacity: off ? 0.4 : 1, fontFamily: "var(--font-mono)", fontSize: 10.5, fontWeight: 700, textTransform: "uppercase", letterSpacing: "0.06em", minHeight: 44 }}>
	155	+ <span style={{ width: 18, height: 0, borderTop: `3px ${dashed ? "dashed" : "solid"} ${color}` }} />
	156	+ {label}
	157	+ </button>
	158	+ );
	159	+}
	160	+
	161	+/* ---------- Barres horizontales (répartitions, géo) ---------- */
	162	+export function BarChart({ title, items, unit }: { title: string; items: BreakItem[]; unit?: string }) {
	163	+ const rows = (items ?? []).slice(0, 14);
	164	+ if (!rows.length) return <EmptyBlock title={title} />;
	165	+ const max = Math.max(...rows.map((r) => r.value), 1);
	166	+ return (
	167	+ <figure className="card" style={{ margin: 0, padding: 16 }}>
	168	+ <figcaption><b style={{ fontFamily: "var(--font-display)", fontSize: 15 }}>{title}</b></figcaption>
	169	+ <div style={{ marginTop: 12, display: "grid", gap: 9 }}>
	170	+ {rows.map((r) => (
	171	+ <div key={r.label} title={`${r.label} — ${fmtNum(r.value)}${unit ? ` ${unit}` : ""}`}>
	172	+ <div style={{ display: "flex", justifyContent: "space-between", fontSize: 12.5 }}>
	173	+ <span style={{ overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }}>{r.label}</span>
	174	+ <b style={{ fontFamily: "var(--font-mono)", fontSize: 11.5 }}>{fmtNum(r.value)}{unit ? ` ${unit}` : ""}</b>
	175	+ </div>
	176	+ <div style={{ marginTop: 3, height: 12, background: "rgba(20,24,20,0.06)", borderRadius: "0 3px 3px 0" }}>
	177	+ <div style={{ height: "100%", width: `${Math.max((r.value / max) * 100, 1)}%`, background: "var(--accent)", border: "1px solid var(--ink)", borderRadius: "0 3px 3px 0", boxSizing: "border-box" }} />
	178	+ </div>
	179	+ </div>
	180	+ ))}
	181	+ </div>
	182	+ </figure>
	183	+ );
	184	+}
	185	+
	186	+/* ---------- Anneau ---------- */
	187	+export function Donut({ title, items }: { title: string; items: BreakItem[] }) {
	188	+ const rows = (items ?? []).filter((i) => i.value > 0).slice(0, 8);
	189	+ const total = rows.reduce((s, r) => s + r.value, 0);
	190	+ if (!total) return <EmptyBlock title={title} />;
	191	+ const R = 74, C = 2 * Math.PI * R;
	192	+ let acc = 0;
	193	+ const shades = [1, 0.78, 0.58, 0.42, 0.3, 0.22, 0.15, 0.1];
	194	+ return (
	195	+ <figure className="card" style={{ margin: 0, padding: 16 }}>
	196	+ <figcaption><b style={{ fontFamily: "var(--font-display)", fontSize: 15 }}>{title}</b></figcaption>
	197	+ <div style={{ display: "flex", flexWrap: "wrap", gap: 18, alignItems: "center", marginTop: 12 }}>
	198	+ <svg viewBox="0 0 200 200" style={{ width: 180, maxWidth: "100%" }} role="img" aria-label={title}>
	199	+ {rows.map((r, i) => {
	200	+ const frac = r.value / total;
	201	+ const off = acc; acc += frac;
	202	+ return (
	203	+ <circle key={r.label} cx={100} cy={100} r={R} fill="none"
	204	+ stroke="var(--accent)" strokeOpacity={shades[i % shades.length]}
	205	+ strokeWidth={30} strokeDasharray={`${frac * C} ${C}`} strokeDashoffset={-off * C}
	206	+ transform="rotate(-90 100 100)">
	207	+ <title>{`${r.label} — ${fmtNum(r.value)} (${((100 * r.value) / total).toFixed(1)} %)`}</title>
	208	+ </circle>
	209	+ );
	210	+ })}
	211	+ <circle cx={100} cy={100} r={R} fill="none" stroke="var(--ink)" strokeWidth={1} opacity={0.5} />
	212	+ </svg>
	213	+ <ul style={{ listStyle: "none", margin: 0, padding: 0, display: "grid", gap: 6, minWidth: 200, flex: 1 }}>
	214	+ {rows.map((r, i) => (
	215	+ <li key={r.label} style={{ display: "flex", alignItems: "center", gap: 8, fontSize: 12.5 }}>
	216	+ <span style={{ width: 11, height: 11, borderRadius: 3, border: "1px solid var(--ink)", background: "var(--accent)", opacity: shades[i % shades.length] }} />
	217	+ <span style={{ flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }}>{r.label}</span>
	218	+ <b style={{ fontFamily: "var(--font-mono)", fontSize: 11 }}>{((100 * r.value) / total).toFixed(1)} %</b>
	219	+ </li>
	220	+ ))}
	221	+ </ul>
	222	+ </div>
	223	+ </figure>
	224	+ );
	225	+}
	226	+
	227	+/* ---------- Calendrier de chaleur ---------- */
	228	+export function CalendarHeatmap({ title, cells }: { title: string; cells: { date: string; value: number }[] }) {
	229	+ if (!cells?.length) return <EmptyBlock title={title} />;
	230	+ const byDate = new Map(cells.map((c) => [c.date, c.value]));
	231	+ const dates = cells.map((c) => c.date).sort();
	232	+ const end = new Date(dates[dates.length - 1] + "T12:00:00");
	233	+ const max = Math.max(...cells.map((c) => c.value), 1);
	234	+ const weeks = 26, cols: { date: string; v: number }[][] = [];
	235	+ const cur = new Date(end);
	236	+ cur.setDate(cur.getDate() - (weeks * 7 - 1));
	237	+ for (let w = 0; w < weeks; w++) {
	238	+ const col: { date: string; v: number }[] = [];
	239	+ for (let d = 0; d < 7; d++) {
	240	+ const iso = cur.toISOString().slice(0, 10);
	241	+ col.push({ date: iso, v: byDate.get(iso) ?? 0 });
	242	+ cur.setDate(cur.getDate() + 1);
	243	+ }
	244	+ cols.push(col);
	245	+ }
	246	+ return (
	247	+ <figure className="card" style={{ margin: 0, padding: 16 }}>
	248	+ <figcaption><b style={{ fontFamily: "var(--font-display)", fontSize: 15 }}>{title}</b> <span className="klabel">26 dernières semaines</span></figcaption>
	249	+ <div className="tbl-wrap" style={{ marginTop: 12 }}>
	250	+ <svg viewBox={`0 0 ${weeks * 14} ${7 * 14}`} style={{ minWidth: 480, width: "100%", height: "auto" }} role="img" aria-label={title}>
	251	+ {cols.map((col, w) => col.map((c, d) => (
	252	+ <rect key={c.date} x={w * 14} y={d * 14} width={12} height={12} rx={2.5}
	253	+ fill={c.v ? "var(--accent)" : "rgba(20,24,20,0.07)"} fillOpacity={c.v ? 0.25 + 0.75 * (c.v / max) : 1}
	254	+ stroke="rgba(20,24,20,0.15)" strokeWidth={0.5}>
	255	+ <title>{`${c.date} — ${fmtNum(c.v)}`}</title>
	256	+ </rect>
	257	+ )))}
	258	+ </svg>
	259	+ </div>
	260	+ </figure>
	261	+ );
	262	+}
	263	+
	264	+/* ---------- Tableau : tri, recherche, pagination ---------- */
	265	+export function DataTable({ spec, pageSize = 25 }: { spec: TableSpec; pageSize?: number }) {
	266	+ const [q, setQ] = useState("");
	267	+ const [sort, setSort] = useState<{ col: number; dir: 1 \| -1 } \| null>(null);
	268	+ const [page, setPage] = useState(0);
	269	+ const rows = useMemo(() => {
	270	+ let r = spec.rows ?? [];
	271	+ if (q) r = r.filter((row) => row.some((c) => String(c).toLowerCase().includes(q.toLowerCase())));
	272	+ if (sort) r = [...r].sort((a, b) => {
	273	+ const x = a[sort.col], y = b[sort.col];
	274	+ const nx = typeof x === "number" ? x : parseFloat(String(x).replace(/[^\d.,-]/g, "").replace(",", "."));
	275	+ const ny = typeof y === "number" ? y : parseFloat(String(y).replace(/[^\d.,-]/g, "").replace(",", "."));
	276	+ if (!Number.isNaN(nx) && !Number.isNaN(ny)) return (nx - ny) * sort.dir;
	277	+ return String(x).localeCompare(String(y), "fr") * sort.dir;
	278	+ });
	279	+ return r;
	280	+ }, [spec.rows, q, sort]);
	281	+ const pages = Math.max(1, Math.ceil(rows.length / pageSize));
	282	+ const cur = Math.min(page, pages - 1);
	283	+ return (
	284	+ <section className="card" style={{ padding: 16 }}>
	285	+ <div style={{ display: "flex", flexWrap: "wrap", gap: 10, justifyContent: "space-between", alignItems: "center" }}>
	286	+ <b style={{ fontFamily: "var(--font-display)", fontSize: 15 }}>{spec.title}</b>
	287	+ <input className="input" style={{ maxWidth: 240 }} placeholder="Rechercher…" value={q}
	288	+ onChange={(e) => { setQ(e.target.value); setPage(0); }} aria-label={`Rechercher dans ${spec.title}`} />
	289	+ </div>
	290	+ <div className="tbl-wrap" style={{ marginTop: 10 }}>
	291	+ <table style={{ width: "100%", borderCollapse: "collapse", fontSize: 13 }}>
	292	+ <thead>
	293	+ <tr>
	294	+ {spec.columns.map((c, i) => (
	295	+ <th key={c} onClick={() => setSort((s) => ({ col: i, dir: s?.col === i && s.dir === 1 ? -1 : 1 }))}
	296	+ style={{ cursor: "pointer", textAlign: "left", padding: "8px 10px", background: "var(--ink)", color: "var(--paper)", fontFamily: "var(--font-mono)", fontSize: 10.5, textTransform: "uppercase", letterSpacing: "0.06em", whiteSpace: "nowrap", userSelect: "none" }}
	297	+ aria-sort={sort?.col === i ? (sort.dir === 1 ? "ascending" : "descending") : "none"}>
	298	+ {c} {sort?.col === i ? (sort.dir === 1 ? "▲" : "▼") : "↕"}
	299	+ </th>
	300	+ ))}
	301	+ </tr>
	302	+ </thead>
	303	+ <tbody>
	304	+ {rows.slice(cur * pageSize, (cur + 1) * pageSize).map((row, ri) => (
	305	+ <tr key={ri} style={{ background: ri % 2 ? "var(--surface-2)" : "var(--surface)" }}>
	306	+ {row.map((c, ci) => (
	307	+ <td key={ci} style={{ padding: "7px 10px", borderBottom: "1px solid var(--line)", whiteSpace: "nowrap" }}>
	308	+ {typeof c === "number" ? fmtNum(c) : c}
	309	+ </td>
	310	+ ))}
	311	+ </tr>
	312	+ ))}
	313	+ </tbody>
	314	+ </table>
	315	+ </div>
	316	+ <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginTop: 10, flexWrap: "wrap", gap: 8 }}>
	317	+ <span className="klabel">{fmtInt(rows.length)} lignes</span>
	318	+ <span style={{ display: "flex", gap: 6 }}>
	319	+ <button type="button" className="btn btn-ghost" disabled={cur === 0} onClick={() => setPage(cur - 1)}>←</button>
	320	+ <span className="chip">{cur + 1} / {pages}</span>
	321	+ <button type="button" className="btn btn-ghost" disabled={cur >= pages - 1} onClick={() => setPage(cur + 1)}>→</button>
	322	+ </span>
	323	+ </div>
	324	+ </section>
	325	+ );
	326	+}
	327	+
	328	+/* ---------- Records / faits marquants ---------- */
	329	+export function RecordCard({ r }: { r: RecordFact }) {
	330	+ return (
	331	+ <article className="card" style={{ padding: "12px 16px", display: "flex", justifyContent: "space-between", gap: 12, alignItems: "baseline", background: "var(--surface-2)" }}>
	332	+ <span style={{ fontSize: 13, color: "var(--ink-2)" }}>{r.label}</span>
	333	+ <span style={{ textAlign: "right" }}>
	334	+ <b style={{ fontFamily: "var(--font-display)", fontSize: 15 }}>{r.value}</b>
	335	+ {r.date && <span className="klabel" style={{ display: "block" }}>{r.date}</span>}
	336	+ </span>
	337	+ </article>
	338	+ );
	339	+}
	340	+
	341	+/* ---------- Bouton PDF ---------- */
	342	+export function PdfButton({ period, from, to, endpoint = "/api/stats/report" }: { period: string; from?: string; to?: string; endpoint?: string }) {
	343	+ const [busy, setBusy] = useState(false);
	344	+ const url = (mode: string) => {
	345	+ const p = new URLSearchParams({ period, mode });
	346	+ if (from) p.set("from", from);
	347	+ if (to) p.set("to", to);
	348	+ return `${endpoint}?${p}`;
	349	+ };
	350	+ const dl = (mode: string) => {
	351	+ setBusy(true);
	352	+ const a = document.createElement("a");
	353	+ a.href = url(mode);
	354	+ a.download = "";
	355	+ document.body.appendChild(a);
	356	+ a.click();
	357	+ a.remove();
	358	+ setTimeout(() => setBusy(false), 2500);
	359	+ };
	360	+ return (
	361	+ <span style={{ display: "inline-flex", gap: 8, flexWrap: "wrap" }}>
	362	+ <button type="button" className="btn btn-primary" onClick={() => dl("complet")} disabled={busy}>
	363	+ {busy ? "Génération…" : "⬇ Télécharger le rapport PDF"}
	364	+ </button>
	365	+ <button type="button" className="btn btn-ghost" onClick={() => dl("synthese")} disabled={busy}>
	366	+ Synthèse (2 p.)
	367	+ </button>
	368	+ </span>
	369	+ );
	370	+}
	371	+
	372	+/* ---------- États ---------- */
	373	+export function EmptyBlock({ title }: { title: string }) {
	374	+ return (
	375	+ <div className="card" style={{ padding: 20, background: "var(--surface-2)", borderStyle: "dashed" }}>
	376	+ <b style={{ fontFamily: "var(--font-display)", fontSize: 14 }}>{title}</b>
	377	+ <p className="klabel" style={{ margin: "6px 0 0" }}>Pas encore mesuré — aucune donnée disponible pour cette période.</p>
	378	+ </div>
	379	+ );
	380	+}
	381	+
	382	+export function Fraicheur({ updated, onRefresh }: { updated: string; onRefresh: () => void }) {
	383	+ return (
	384	+ <p style={{ display: "flex", gap: 10, alignItems: "center", flexWrap: "wrap", margin: 0 }}>
	385	+ <span className="klabel">Mis à jour le {new Date(updated).toLocaleString("fr-CA", { dateStyle: "medium", timeStyle: "short" })}</span>
	386	+ <button type="button" className="btn btn-ghost" onClick={onRefresh}>↻ Rafraîchir</button>
	387	+ </p>
	388	+ );
	389	+}

added src/ka/stats/kapdf.py +558 −0

		`@@ -0,0 +1,558 @@`
	1	+# Auteur : Simon-Pierre Boucher — contact@spboucher.ai
	2	+# ka-ui/stats/kapdf.py — moteur PDF commun Groupe KA (fpdf2).
	3	+# Consomme le JSON du contrat /api/stats/dashboard (voir SPEC.md) et produit
	4	+# le rapport estampillé Groupe-KA : couverture, sommaire, KPI, graphiques
	5	+# VECTORIELS (courbes/barres/anneaux), tableaux paginés, records, page de fin.
	6	+# Usage :
	7	+# from kapdf import GroupeKAReport
	8	+# pdf_bytes = GroupeKAReport(site={"wordmark":"Lou·Ka","accent":"#ff6a00",
	9	+# "domain":"www.lou-ka.com","tagline":"…"}, dashboard=dash_json,
	10	+# mode="complet").build()
	11	+# Dépendance : pip install fpdf2 (aucune autre)
	12	+from __future__ import annotations
	13	+
	14	+import math
	15	+from datetime import datetime
	16	+from zoneinfo import ZoneInfo
	17	+
	18	+from fpdf import FPDF
	19	+
	20	+INK = (20, 24, 20)
	21	+INK2 = (77, 85, 81)
	22	+INK3 = (139, 146, 140)
	23	+PAPER = (245, 243, 238)
	24	+SURFACE2 = (250, 249, 245)
	25	+GREEN = (28, 92, 65)
	26	+DANGER = (179, 66, 58)
	27	+WHITE = (255, 255, 255)
	28	+
	29	+EMAILS = [
	30	+ ("contact@groupe-ka.com", "Projets, partenariats & données"),
	31	+ ("info@groupe-ka.com", "Médias & questions générales"),
	32	+ ("admin@groupe-ka.com", "Légal, vie privée & Loi 25"),
	33	+]
	34	+DISCLAIMER = (
	35	+ "Groupe KA est un agrégateur de contenu : nous ne vendons rien, ne louons "
	36	+ "rien et ne sommes partie à aucune transaction. Données lues à la source, "
	37	+ "rien d'inventé, tout est traçable."
	38	+)
	39	+
	40	+
	41	+def _hex(c: str) -> tuple[int, int, int]:
	42	+ c = c.lstrip("#")
	43	+ return tuple(int(c[i : i + 2], 16) for i in (0, 2, 4)) # type: ignore
	44	+
	45	+
	46	+def _fr(n) -> str:
	47	+ if isinstance(n, float) and not n.is_integer():
	48	+ return f"{n:,.2f}".replace(",", " ").replace(".", ",")
	49	+ return f"{int(n):,}".replace(",", " ")
	50	+
	51	+
	52	+_SUBST = {
	53	+ "—": "-", "–": "-", "→": "->", "▲": "+", "▼": "-",
	54	+ "…": "...", "’": "'", "‘": "'", "“": '"', "”": '"',
	55	+ "œ": "oe", "Œ": "OE", "−": "-", " ": " ", " ": " ",
	56	+}
	57	+
	58	+
	59	+def _latin1(s: str) -> str:
	60	+ for k, v in _SUBST.items():
	61	+ s = s.replace(k, v)
	62	+ return s.encode("latin-1", "replace").decode("latin-1")
	63	+
	64	+
	65	+class _PDF(FPDF):
	66	+ """FPDF avec en-tête/pied Groupe-KA sur chaque page (sauf couverture).
	67	+ Les polices core sont latin-1 : normalize_text sanitise en amont."""
	68	+
	69	+ def normalize_text(self, text):
	70	+ return super().normalize_text(_latin1(text))
	71	+
	72	+ def __init__(self, brand: str, accent: tuple, period_label: str):
	73	+ super().__init__(orientation="P", unit="mm", format="A4")
	74	+ self.brand = brand
	75	+ self.accent = accent
	76	+ self.period_label = period_label
	77	+ self.cover_mode = False
	78	+ self.set_margins(18, 20, 18)
	79	+ self.set_auto_page_break(True, margin=22)
	80	+
	81	+ def header(self):
	82	+ if self.cover_mode:
	83	+ return
	84	+ self.set_font("helvetica", "B", 8.5)
	85	+ self.set_text_color(*INK)
	86	+ self.set_xy(18, 9)
	87	+ self.cell(0, 5, f"Groupe KA · {self.brand}")
	88	+ self.set_font("helvetica", "", 8)
	89	+ self.set_text_color(*INK3)
	90	+ self.set_xy(18, 9)
	91	+ self.cell(0, 5, "Rapport statistique", align="R")
	92	+ self.set_draw_color(*INK)
	93	+ self.set_line_width(0.5)
	94	+ self.line(18, 15.5, 192, 15.5)
	95	+ self.set_y(20)
	96	+
	97	+ def footer(self):
	98	+ if self.cover_mode:
	99	+ return
	100	+ self.set_y(-15)
	101	+ self.set_draw_color(*INK3)
	102	+ self.set_line_width(0.2)
	103	+ self.line(18, self.get_y() - 1.5, 192, self.get_y() - 1.5)
	104	+ self.set_font("helvetica", "", 7.5)
	105	+ self.set_text_color(*INK3)
	106	+ year = datetime.now(ZoneInfo("America/Toronto")).year
	107	+ self.cell(130, 5, f"© Groupe-KA — {year} — groupe-ka.com · {self.period_label}")
	108	+ self.cell(0, 5, f"p. {self.page_no()}/{{nb}}", align="R")
	109	+
	110	+
	111	+class GroupeKAReport:
	112	+ def __init__(self, site: dict, dashboard: dict, mode: str = "complet"):
	113	+ self.site = site
	114	+ self.d = dashboard
	115	+ self.mode = mode
	116	+ self.accent = _hex(site.get("accent", "#d9f26b"))
	117	+ period = dashboard.get("period", {}) or {}
	118	+ self.period_label = period.get("label") or "toute la période"
	119	+ self.pdf = _PDF(site.get("wordmark", ""), self.accent, self.period_label)
	120	+ self.toc: list[tuple[str, int]] = []
	121	+
	122	+ # ---------- primitives ----------
	123	+ def _card(self, x, y, w, h, fill=WHITE):
	124	+ p = self.pdf
	125	+ p.set_draw_color(*INK)
	126	+ p.set_line_width(0.45)
	127	+ p.set_fill_color(*fill)
	128	+ p.rect(x, y, w, h, style="DF", round_corners=True, corner_radius=2.2)
	129	+
	130	+ def _kicker(self, text):
	131	+ p = self.pdf
	132	+ p.set_font("helvetica", "B", 8)
	133	+ p.set_text_color(*GREEN)
	134	+ p.set_draw_color(*GREEN)
	135	+ p.set_line_width(0.6)
	136	+ y = p.get_y() + 2
	137	+ p.line(p.l_margin, y, p.l_margin + 7, y)
	138	+ p.set_xy(p.l_margin + 9, y - 2.5)
	139	+ p.cell(0, 5, text.upper())
	140	+ p.ln(8)
	141	+
	142	+ def _section_title(self, title):
	143	+ if self.pdf.get_y() > 240:
	144	+ self.pdf.add_page()
	145	+ self._kicker("Groupe KA · " + self.site.get("wordmark", ""))
	146	+ self.pdf.set_font("helvetica", "B", 15)
	147	+ self.pdf.set_text_color(*INK)
	148	+ self.pdf.set_x(self.pdf.l_margin)
	149	+ self.pdf.cell(0, 8, title)
	150	+ self.toc.append((title, self.pdf.page_no()))
	151	+ self.pdf.ln(11)
	152	+
	153	+ # ---------- pages ----------
	154	+ def _cover(self):
	155	+ p = self.pdf
	156	+ p.cover_mode = True
	157	+ p.set_auto_page_break(False)
	158	+ p.add_page()
	159	+ p.set_fill_color(*PAPER)
	160	+ p.rect(0, 0, 210, 297, style="F")
	161	+ p.set_draw_color(*INK)
	162	+ p.set_line_width(1.0)
	163	+ p.rect(10, 10, 190, 277)
	164	+ # kicker
	165	+ p.set_font("helvetica", "B", 10)
	166	+ p.set_text_color(*GREEN)
	167	+ p.set_xy(24, 34)
	168	+ p.cell(0, 6, "GROUPE KA · RAPPORT STATISTIQUE")
	169	+ # wordmark : partie gauche + boîte encre/accent
	170	+ wm = self.site.get("wordmark", "")
	171	+ left, boxed = (wm.split("·") + [None])[:2] if "·" in wm else (wm, None)
	172	+ p.set_xy(24, 70)
	173	+ p.set_font("helvetica", "B", 40)
	174	+ p.set_text_color(*INK)
	175	+ p.cell(p.get_string_width(left) + 2, 20, left)
	176	+ if boxed:
	177	+ bw = p.get_string_width(boxed) + 12
	178	+ x = p.get_x() + 2
	179	+ p.set_fill_color(*INK)
	180	+ p.rect(x, 68, bw, 22, style="F", round_corners=True, corner_radius=3)
	181	+ p.set_text_color(*self.accent)
	182	+ p.set_xy(x + 6, 70)
	183	+ p.cell(bw - 12, 18, boxed)
	184	+ p.set_xy(24, 100)
	185	+ p.set_font("helvetica", "", 13)
	186	+ p.set_text_color(*INK2)
	187	+ p.multi_cell(150, 7, f"Rapport statistique — {wm}")
	188	+ now = datetime.now(ZoneInfo("America/Toronto"))
	189	+ per = self.d.get("period", {}) or {}
	190	+ p.set_xy(24, 125)
	191	+ p.set_font("helvetica", "", 10.5)
	192	+ rows = [
	193	+ ("Période couverte", self.period_label + (f" ({per.get('from')} → {per.get('to')})" if per.get("from") else "")),
	194	+ ("Généré le", now.strftime("%Y-%m-%d à %H:%M") + " (heure de l'Est)"),
	195	+ ("Plateforme", "https://" + self.site.get("domain", "")),
	196	+ ("Mode", "Rapport complet" if self.mode == "complet" else "Synthèse"),
	197	+ ]
	198	+ y = 128
	199	+ for k, v in rows:
	200	+ p.set_xy(24, y)
	201	+ p.set_text_color(*INK3)
	202	+ p.cell(40, 6, k)
	203	+ p.set_text_color(*INK)
	204	+ p.set_font("helvetica", "B", 10.5)
	205	+ p.cell(0, 6, str(v))
	206	+ p.set_font("helvetica", "", 10.5)
	207	+ y += 8
	208	+ # bande encre au pied
	209	+ p.set_fill_color(*INK)
	210	+ p.rect(10, 262, 190, 25, style="F")
	211	+ p.set_xy(24, 270)
	212	+ p.set_font("helvetica", "B", 12)
	213	+ p.set_text_color(*WHITE)
	214	+ p.cell(60, 8, "par Groupe ")
	215	+ p.set_text_color(*self.accent)
	216	+ p.set_xy(24 + p.get_string_width("par Groupe ") + 1, 270)
	217	+ p.cell(20, 8, "KA")
	218	+ p.set_font("helvetica", "B", 10)
	219	+ p.set_xy(24, 270)
	220	+ p.set_text_color(*self.accent)
	221	+ p.cell(162, 8, "groupe-ka.com", align="R")
	222	+ p.set_auto_page_break(True, margin=22)
	223	+ p.cover_mode = False
	224	+
	225	+ def _kpis(self):
	226	+ kpis = self.d.get("kpis") or []
	227	+ if not kpis:
	228	+ return
	229	+ self._section_title("Synthèse des indicateurs")
	230	+ p = self.pdf
	231	+ cols, gw, gh, gap = 3, 56, 26, 3
	232	+ x0, y = p.l_margin, p.get_y()
	233	+ for i, k in enumerate(kpis[:9]):
	234	+ x = x0 + (i % cols) * (gw + gap)
	235	+ if i and i % cols == 0:
	236	+ y += gh + gap
	237	+ if y > 250:
	238	+ p.add_page(); y = p.get_y()
	239	+ self._card(x, y, gw, gh)
	240	+ p.set_xy(x + 4, y + 4)
	241	+ p.set_font("helvetica", "B", 14)
	242	+ p.set_text_color(*INK)
	243	+ val = k.get("value")
	244	+ p.cell(gw - 8, 7, (_fr(val) if isinstance(val, (int, float)) else str(val)) + (" " + k["unit"] if k.get("unit") else ""))
	245	+ p.set_xy(x + 4, y + 12)
	246	+ p.set_font("helvetica", "", 7.6)
	247	+ p.set_text_color(*INK2)
	248	+ p.multi_cell(gw - 8, 3.6, str(k.get("label", ""))[:70])
	249	+ if k.get("delta_pct") is not None:
	250	+ up = (k.get("direction") or ("up" if k["delta_pct"] >= 0 else "down")) == "up"
	251	+ p.set_xy(x + 4, y + gh - 6.5)
	252	+ p.set_font("helvetica", "B", 8)
	253	+ p.set_text_color(*(GREEN if up else DANGER))
	254	+ arrow = "+" if k["delta_pct"] >= 0 else ""
	255	+ p.cell(gw - 8, 4, f"{'▲' if up else '▼'} {arrow}{str(k['delta_pct']).replace('.', ',')} % vs période préc.")
	256	+ p.set_y(y + gh + 8)
	257	+
	258	+ def _line_chart(self, s):
	259	+ p = self.pdf
	260	+ pts = s.get("points") or []
	261	+ if len(pts) < 2:
	262	+ return
	263	+ if p.get_y() > 200:
	264	+ p.add_page()
	265	+ p.set_font("helvetica", "B", 10)
	266	+ p.set_text_color(*INK)
	267	+ p.cell(0, 6, s.get("title", ""))
	268	+ p.ln(7)
	269	+ x0, y0, w, h = p.l_margin, p.get_y(), 174, 52
	270	+ self._card(x0, y0, w, h, fill=WHITE)
	271	+ cx, cy, cw, ch = x0 + 12, y0 + 6, w - 20, h - 16
	272	+ vals = [pt["v"] for pt in pts] + [c["v"] for c in (s.get("compare") or [])]
	273	+ vmax = max(vals) or 1
	274	+ vmin = min(0, min(vals))
	275	+ rng = (vmax - vmin) or 1
	276	+ # grille + graduations
	277	+ p.set_font("helvetica", "", 6.3)
	278	+ p.set_text_color(*INK3)
	279	+ p.set_draw_color(200, 200, 195)
	280	+ p.set_line_width(0.15)
	281	+ for g in range(5):
	282	+ gy = cy + ch - ch * g / 4
	283	+ p.line(cx, gy, cx + cw, gy)
	284	+ p.set_xy(x0 + 1, gy - 1.6)
	285	+ p.cell(10, 3, _fr(vmin + rng * g / 4), align="R")
	286	+
	287	+ def draw(series, color, width, dash=None):
	288	+ n = len(series)
	289	+ p.set_draw_color(*color)
	290	+ p.set_line_width(width)
	291	+ if dash:
	292	+ p.set_dash_pattern(dash=1.2, gap=1.2)
	293	+ last = None
	294	+ for i, pt in enumerate(series):
	295	+ px = cx + cw * (i / (n - 1))
	296	+ py = cy + ch - ch * ((pt["v"] - vmin) / rng)
	297	+ if last:
	298	+ p.line(last[0], last[1], px, py)
	299	+ last = (px, py)
	300	+ p.set_dash_pattern()
	301	+
	302	+ if s.get("compare"):
	303	+ draw(s["compare"], INK3, 0.35, dash=True)
	304	+ draw(pts, self.accent, 0.7)
	305	+ # libellés d'axe X (premier / milieu / dernier)
	306	+ p.set_text_color(*INK3)
	307	+ for frac, idx in ((0, 0), (0.5, len(pts) // 2), (1, -1)):
	308	+ p.set_xy(cx + cw * frac - 9, cy + ch + 1.5)
	309	+ p.cell(18, 3, str(pts[idx].get("t", ""))[:10], align="C")
	310	+ p.set_y(y0 + h + 4)
	311	+ if s.get("compare"):
	312	+ p.set_font("helvetica", "", 6.8)
	313	+ p.set_text_color(*INK3)
	314	+ p.cell(0, 4, "— période courante (accent) · ---- période comparée")
	315	+ p.ln(6)
	316	+ else:
	317	+ p.ln(2)
	318	+
	319	+ def _bars(self, title, items, unit=""):
	320	+ p = self.pdf
	321	+ items = [it for it in (items or []) if isinstance(it.get("value"), (int, float))][:12]
	322	+ if not items:
	323	+ return
	324	+ need = 10 + len(items) * 7
	325	+ if p.get_y() + need > 265:
	326	+ p.add_page()
	327	+ p.set_font("helvetica", "B", 10)
	328	+ p.set_text_color(*INK)
	329	+ p.cell(0, 6, title)
	330	+ p.ln(8)
	331	+ vmax = max(it["value"] for it in items) or 1
	332	+ for it in items:
	333	+ y = p.get_y()
	334	+ p.set_font("helvetica", "", 7.6)
	335	+ p.set_text_color(*INK)
	336	+ p.set_x(p.l_margin)
	337	+ p.cell(46, 5, str(it["label"])[:34])
	338	+ bw = 96 * (it["value"] / vmax)
	339	+ p.set_fill_color(*self.accent)
	340	+ p.set_draw_color(*INK)
	341	+ p.set_line_width(0.25)
	342	+ p.rect(p.l_margin + 48, y + 0.7, max(bw, 0.8), 3.6, style="DF")
	343	+ p.set_xy(p.l_margin + 148, y)
	344	+ p.set_font("helvetica", "B", 7.6)
	345	+ p.cell(26, 5, _fr(it["value"]) + (" " + unit if unit else ""), align="R")
	346	+ p.ln(6.4)
	347	+ p.ln(3)
	348	+
	349	+ def _donut(self, b):
	350	+ # anneau vectoriel simple (arcs) + légende
	351	+ p = self.pdf
	352	+ items = [it for it in (b.get("items") or []) if it.get("value")][:8]
	353	+ total = sum(it["value"] for it in items)
	354	+ if not items or not total:
	355	+ return
	356	+ if p.get_y() > 210:
	357	+ p.add_page()
	358	+ p.set_font("helvetica", "B", 10)
	359	+ p.set_text_color(*INK)
	360	+ p.cell(0, 6, b.get("title", ""))
	361	+ p.ln(8)
	362	+ cx, cy, r = p.l_margin + 26, p.get_y() + 24, 20
	363	+ shades = [1.0, 0.78, 0.58, 0.42, 0.30, 0.22, 0.15, 0.10]
	364	+ start = -90.0
	365	+ for i, it in enumerate(items):
	366	+ frac = it["value"] / total
	367	+ f = shades[i % len(shades)]
	368	+ col = tuple(int(PAPER[j] + (self.accent[j] - PAPER[j]) * f) for j in range(3))
	369	+ steps = max(2, int(72 * frac))
	370	+ p.set_fill_color(*col)
	371	+ p.set_draw_color(*col)
	372	+ for st in range(steps):
	373	+ a0 = math.radians(start + 360 * frac * st / steps)
	374	+ a1 = math.radians(start + 360 * frac * (st + 1) / steps)
	375	+ p.polygon(
	376	+ [(cx, cy),
	377	+ (cx + r * math.cos(a0), cy + r * math.sin(a0)),
	378	+ (cx + r * math.cos(a1), cy + r * math.sin(a1))],
	379	+ style="DF",
	380	+ )
	381	+ start += 360 * frac
	382	+ p.set_fill_color(*WHITE)
	383	+ p.set_draw_color(*INK)
	384	+ p.set_line_width(0.4)
	385	+ p.ellipse(cx - 11, cy - 11, 22, 22, style="DF")
	386	+ p.ellipse(cx - r, cy - r, 2 * r, 2 * r, style="D")
	387	+ # légende
	388	+ ly = cy - 22
	389	+ for i, it in enumerate(items):
	390	+ f = shades[i % len(shades)]
	391	+ col = tuple(int(PAPER[j] + (self.accent[j] - PAPER[j]) * f) for j in range(3))
	392	+ p.set_fill_color(*col)
	393	+ p.set_draw_color(*INK)
	394	+ p.rect(p.l_margin + 60, ly + 0.8, 4, 4, style="DF")
	395	+ p.set_xy(p.l_margin + 66, ly)
	396	+ p.set_font("helvetica", "", 7.6)
	397	+ p.set_text_color(*INK)
	398	+ pct = 100 * it["value"] / total
	399	+ p.cell(0, 5.6, f"{str(it['label'])[:40]} — {_fr(it['value'])} ({pct:.1f} %)".replace(".", ","))
	400	+ ly += 5.6
	401	+ p.set_y(max(cy + r, ly) + 6)
	402	+
	403	+ def _table(self, t):
	404	+ p = self.pdf
	405	+ cols = t.get("columns") or []
	406	+ rows = t.get("rows") or []
	407	+ if not cols or not rows:
	408	+ return
	409	+ self._section_title(t.get("title", "Tableau"))
	410	+ w = 174 / len(cols)
	411	+ def head():
	412	+ p.set_font("helvetica", "B", 7.6)
	413	+ p.set_fill_color(*INK)
	414	+ p.set_text_color(*WHITE)
	415	+ for c in cols:
	416	+ p.cell(w, 6, " " + str(c)[:30], fill=True)
	417	+ p.ln(6)
	418	+ head()
	419	+ p.set_text_color(*INK)
	420	+ for i, row in enumerate(rows[:200]):
	421	+ if p.get_y() > 262:
	422	+ p.add_page()
	423	+ head()
	424	+ p.set_text_color(*INK)
	425	+ p.set_font("helvetica", "", 7.4)
	426	+ p.set_fill_color(*(SURFACE2 if i % 2 else WHITE))
	427	+ for cell in row:
	428	+ txt = _fr(cell) if isinstance(cell, (int, float)) else str(cell)
	429	+ p.cell(w, 5.4, " " + txt[:34], fill=True)
	430	+ p.ln(5.4)
	431	+ if len(rows) > 200:
	432	+ p.set_font("helvetica", "", 7)
	433	+ p.set_text_color(*INK3)
	434	+ p.cell(0, 5, f"… {len(rows) - 200} lignes supplémentaires non imprimées")
	435	+ p.ln(6)
	436	+
	437	+ def _records(self):
	438	+ recs = self.d.get("records") or []
	439	+ if not recs:
	440	+ return
	441	+ self._section_title("Records & faits marquants")
	442	+ p = self.pdf
	443	+ for r in recs[:10]:
	444	+ if p.get_y() > 258:
	445	+ p.add_page()
	446	+ y = p.get_y()
	447	+ self._card(p.l_margin, y, 174, 11, fill=SURFACE2)
	448	+ p.set_xy(p.l_margin + 4, y + 2)
	449	+ p.set_font("helvetica", "", 8.6)
	450	+ p.set_text_color(*INK2)
	451	+ p.cell(96, 7, str(r.get("label", ""))[:70])
	452	+ p.set_font("helvetica", "B", 9)
	453	+ p.set_text_color(*INK)
	454	+ p.cell(52, 7, str(r.get("value", ""))[:36], align="R")
	455	+ p.set_font("helvetica", "", 7.6)
	456	+ p.set_text_color(*INK3)
	457	+ p.cell(20, 7, str(r.get("date", "") or ""), align="R")
	458	+ p.set_y(y + 13.5)
	459	+ p.ln(4)
	460	+
	461	+ def _final_page(self):
	462	+ p = self.pdf
	463	+ p.add_page()
	464	+ self._kicker("Groupe KA · contact")
	465	+ p.set_font("helvetica", "B", 15)
	466	+ p.set_text_color(*INK)
	467	+ p.cell(0, 8, "Coordonnées du Groupe KA")
	468	+ p.ln(12)
	469	+ for email, role in EMAILS:
	470	+ p.set_font("helvetica", "B", 10.5)
	471	+ p.set_text_color(*INK)
	472	+ p.cell(0, 6, email)
	473	+ p.ln(5.5)
	474	+ p.set_font("helvetica", "", 8.6)
	475	+ p.set_text_color(*INK3)
	476	+ p.cell(0, 5, role)
	477	+ p.ln(8)
	478	+ p.ln(2)
	479	+ p.set_font("helvetica", "B", 10)
	480	+ p.set_text_color(*GREEN)
	481	+ p.cell(0, 6, "groupe-ka.com — le portail de l'écosystème ·Ka")
	482	+ p.ln(10)
	483	+ p.set_draw_color(*self.accent)
	484	+ p.set_line_width(0.8)
	485	+ p.line(p.l_margin, p.get_y(), p.l_margin + 30, p.get_y())
	486	+ p.ln(4)
	487	+ p.set_font("helvetica", "", 8.6)
	488	+ p.set_text_color(*INK2)
	489	+ p.multi_cell(160, 4.6, DISCLAIMER)
	490	+ p.ln(4)
	491	+ p.set_font("helvetica", "", 7.6)
	492	+ p.set_text_color(*INK3)
	493	+ p.multi_cell(
	494	+ 160, 4.2,
	495	+ "Mentions : rapport généré automatiquement à partir des données réelles de la "
	496	+ "plateforme au moment indiqué en couverture. Conditions d'utilisation, politique "
	497	+ "de confidentialité et protection des renseignements personnels (Loi 25) : "
	498	+ "groupe-ka.com/conditions · /confidentialite · /loi-25.",
	499	+ )
	500	+
	501	+ def _toc_page(self):
	502	+ # insérée après coup ? fpdf ne réordonne pas : on écrit le sommaire en
	503	+ # page 2 en réservant la page lors du build (voir build()).
	504	+ pass
	505	+
	506	+ def build(self) -> bytes:
	507	+ p = self.pdf
	508	+ p.alias_nb_pages()
	509	+ self._cover()
	510	+ if self.mode == "synthese":
	511	+ p.add_page()
	512	+ self._kpis()
	513	+ self._records()
	514	+ self._final_page()
	515	+ else:
	516	+ p.add_page()
	517	+ toc_page_no = p.page_no()
	518	+ p.add_page()
	519	+ self._kpis()
	520	+ for s in self.d.get("series") or []:
	521	+ if s.get("kind") == "bar":
	522	+ self._bars(s.get("title", ""), [{"label": pt.get("t"), "value": pt.get("v")} for pt in (s.get("points") or [])], s.get("unit", ""))
	523	+ else:
	524	+ self._line_chart(s)
	525	+ for b in self.d.get("breakdowns") or []:
	526	+ if b.get("kind") == "donut":
	527	+ self._donut(b)
	528	+ else:
	529	+ self._bars(b.get("title", ""), b.get("items"))
	530	+ geo = self.d.get("geo")
	531	+ if geo:
	532	+ self._bars(geo.get("title", "Répartition géographique"), geo.get("items"))
	533	+ for t in self.d.get("tables") or []:
	534	+ self._table(t)
	535	+ self._records()
	536	+ self._final_page()
	537	+ # sommaire écrit sur la page réservée (page 2)
	538	+ last_page = p.page
	539	+ p.page = toc_page_no
	540	+ p.set_y(22)
	541	+ p.set_font("helvetica", "B", 15)
	542	+ p.set_text_color(*INK)
	543	+ p.cell(0, 8, "Sommaire")
	544	+ p.ln(12)
	545	+ p.set_font("helvetica", "", 9.5)
	546	+ for title, page_no in self.toc:
	547	+ p.set_text_color(*INK)
	548	+ p.cell(140, 6.5, title[:80])
	549	+ p.set_text_color(*INK3)
	550	+ p.cell(0, 6.5, str(page_no), align="R")
	551	+ p.ln(6.5)
	552	+ p.page = last_page
	553	+ return bytes(p.output())
	554	+
	555	+
	556	+def filename(platform_id: str, period: str) -> str:
	557	+ today = datetime.now(ZoneInfo("America/Toronto")).strftime("%Y-%m-%d")
	558	+ return f"groupe-ka_{platform_id}_stats_{period}_{today}.pdf"

added src/lib/ecostats.ts +173 −0

		`@@ -0,0 +1,173 @@`
	1	+// Auteur : Simon-Pierre Boucher — contact@spboucher.ai
	2	+// Statistiques de l'écosystème — fetch serveur parallèle des tableaux de
	3	+// bord /api/stats/dashboard des 11 plateformes de données (contrat commun
	4	+// src/ka/stats/SPEC.md), cache ISR 10 min, délai 8 s, null si échec.
	5	+// AUCUNE donnée inventée : une plateforme injoignable reste null et la page
	6	+// l'affiche comme « indisponible ».
	7	+
	8	+import eco from "@/ka/ecosystem.json";
	9	+
	10	+export type Kpi = {
	11	+ id?: string;
	12	+ label: string;
	13	+ value: number \| string;
	14	+ unit?: string;
	15	+ delta_pct?: number;
	16	+ direction?: "up" \| "down";
	17	+};
	18	+
	19	+export type KaRecord = { label: string; value: string; date?: string };
	20	+
	21	+export type Dashboard = {
	22	+ updated?: string;
	23	+ period?: { from?: string; to?: string; label?: string };
	24	+ kpis?: Kpi[];
	25	+ records?: KaRecord[];
	26	+};
	27	+
	28	+export type Site = {
	29	+ id: string;
	30	+ wordmark: string;
	31	+ domain: string;
	32	+ accent: string;
	33	+ accentSoft: string;
	34	+ tagline: string;
	35	+};
	36	+
	37	+export type PlatformStats = { site: Site; dash: Dashboard \| null };
	38	+
	39	+export const PERIODS = [
	40	+ ["auj", "Aujourd'hui"],
	41	+ ["7j", "7 jours"],
	42	+ ["30j", "30 jours"],
	43	+ ["3m", "3 mois"],
	44	+ ["6m", "6 mois"],
	45	+ ["12m", "12 mois"],
	46	+ ["annee", "Année en cours"],
	47	+ ["tout", "Tout"],
	48	+] as const;
	49	+
	50	+export type PeriodKey = (typeof PERIODS)[number][0];
	51	+
	52	+export const isPeriod = (p: string \| undefined): p is PeriodKey =>
	53	+ PERIODS.some(([k]) => k === p);
	54	+
	55	+// Identifiants de KPI « nouveautés de la période » connus des plateformes.
	56	+const NEW_KPI_IDS = [
	57	+ "nouvelles",
	58	+ "nouveaux",
	59	+ "nouveautes",
	60	+ "new",
	61	+ "ajouts",
	62	+ "added",
	63	+ "indexees",
	64	+ "releves",
	65	+ "records",
	66	+];
	67	+
	68	+const isNum = (v: unknown): v is number =>
	69	+ typeof v === "number" && Number.isFinite(v);
	70	+
	71	+/** Premier KPI numérique = volume principal (convention du contrat SPEC). */
	72	+export function mainKpi(dash: Dashboard \| null): Kpi \| null {
	73	+ for (const k of dash?.kpis ?? []) if (isNum(k.value)) return k;
	74	+ return null;
	75	+}
	76	+
	77	+/** KPI « nouveautés de la période », si la plateforme le mesure. */
	78	+export function newKpi(dash: Dashboard \| null): Kpi \| null {
	79	+ const kpis = dash?.kpis ?? [];
	80	+ for (const id of NEW_KPI_IDS) {
	81	+ const k = kpis.find((k) => k.id === id && isNum(k.value));
	82	+ if (k) return k;
	83	+ }
	84	+ return null;
	85	+}
	86	+
	87	+/** Les 3 premiers KPI numériques d'une plateforme (pour son bloc résumé). */
	88	+export function topKpis(dash: Dashboard \| null, n = 3): Kpi[] {
	89	+ return (dash?.kpis ?? []).filter((k) => isNum(k.value)).slice(0, n);
	90	+}
	91	+
	92	+export const dataSites: Site[] = (eco.sites as Site[]).filter(
	93	+ (s) => s.id !== "groupe-ka",
	94	+);
	95	+
	96	+async function fetchDashboard(
	97	+ site: Site,
	98	+ period: PeriodKey,
	99	+): Promise<Dashboard \| null> {
	100	+ try {
	101	+ const res = await fetch(
	102	+ `https://${site.domain}/api/stats/dashboard?period=${period}`,
	103	+ {
	104	+ next: { revalidate: 600 },
	105	+ signal: AbortSignal.timeout(8000),
	106	+ headers: { accept: "application/json" },
	107	+ },
	108	+ );
	109	+ if (!res.ok) return null;
	110	+ let json: unknown = await res.json();
	111	+ // certaines plateformes enveloppent la réponse ({success, data, meta})
	112	+ if (
	113	+ json &&
	114	+ typeof json === "object" &&
	115	+ !("kpis" in json) &&
	116	+ typeof (json as { data?: unknown }).data === "object"
	117	+ ) {
	118	+ json = (json as { data: unknown }).data;
	119	+ }
	120	+ const dash = json as Dashboard;
	121	+ if (!dash \|\| !Array.isArray(dash.kpis) \|\| dash.kpis.length === 0)
	122	+ return null;
	123	+ return dash;
	124	+ } catch {
	125	+ return null;
	126	+ }
	127	+}
	128	+
	129	+/** Dashboards des 11 plateformes de données, en parallèle (ordre d'ecosystem.json). */
	130	+export async function getEcosystemStats(
	131	+ period: PeriodKey,
	132	+): Promise<PlatformStats[]> {
	133	+ return Promise.all(
	134	+ dataSites.map(async (site) => ({
	135	+ site,
	136	+ dash: await fetchDashboard(site, period),
	137	+ })),
	138	+ );
	139	+}
	140	+
	141	+/** Agrégats consolidés — uniquement à partir des plateformes jointes. */
	142	+export function consolidate(platforms: PlatformStats[]) {
	143	+ const ok = platforms.filter((p) => p.dash);
	144	+ let totalVolume = 0;
	145	+ let totalNew = 0;
	146	+ let newCount = 0;
	147	+ let latestUpdate: string \| null = null;
	148	+ for (const p of ok) {
	149	+ const mk = mainKpi(p.dash);
	150	+ if (mk && isNum(mk.value)) totalVolume += mk.value;
	151	+ const nk = newKpi(p.dash);
	152	+ if (nk && isNum(nk.value)) {
	153	+ totalNew += nk.value;
	154	+ newCount += 1;
	155	+ }
	156	+ const upd = p.dash?.updated;
	157	+ if (upd && (!latestUpdate \|\| upd > latestUpdate)) latestUpdate = upd;
	158	+ }
	159	+ const ranked = [...platforms].sort((a, b) => {
	160	+ const va = mainKpi(a.dash)?.value;
	161	+ const vb = mainKpi(b.dash)?.value;
	162	+ return (isNum(vb) ? vb : -1) - (isNum(va) ? va : -1);
	163	+ });
	164	+ return {
	165	+ reachable: ok.length,
	166	+ total: platforms.length,
	167	+ totalVolume,
	168	+ totalNew,
	169	+ newCount,
	170	+ latestUpdate,
	171	+ ranked,
	172	+ };
	173	+}
	174