feat(grid): ajout algorithme score produit avec parametrage dynamique et page d'aide

src/features/grid/components/heatmap-cell.tsx

@@ -0,0 +1,31 @@
+"use client";
+
+interface HeatmapCellProps {
+    value: number | null;
+}
+
+function getHeatmapStyle(value: number | null): { background: string; color: string } {
+    if (value === null || value === 0) {
+        return { background: "var(--bg-elevated)", color: "var(--text-muted)" };
+    }
+    const abs = Math.abs(value);
+    if (abs > 100) return { background: "rgba(45,212,191,0.22)", color: "var(--accent)" };
+    if (abs > 30) return { background: "rgba(45,212,191,0.14)", color: "var(--accent)" };
+    if (abs > 10) return { background: "rgba(45,212,191,0.08)", color: "var(--accent)" };
+    return { background: "var(--bg-elevated)", color: "var(--text-secondary)" };
+}
+
+export function HeatmapCell({ value }: HeatmapCellProps) {
+    const style = getHeatmapStyle(value);
+    const display = value === null || value === 0 ? "—" : Math.round(Math.abs(value)).toString();
+
+    return (
+        <div
+            className="rounded text-center text-[12px] tabular-nums px-0.5 py-0.5 font-bold tracking-tighter transition-colors min-h-[24px] flex items-center justify-center font-mono-nums"
+            style={style}
+            title={value !== null ? `${Math.abs(value).toLocaleString("fr-FR")} unités` : "Aucune vente"}
+        >
+            {display}
+        </div>
+    );
+}