web-player: add lint guardrails for imports, non-null assertions, unused props and icon sizes; refresh docs

web-player/scripts/check-tokens.mjs

@@ -24,12 +24,16 @@ const PAIRED_HW = /\b(?:([a-z0-9-]+:))?h-([\d.]+)\s+\1w-\2\b/g;
 const QUARTER_STEP_SPACING = /\b[a-z-]+-\d+\.(25|75)\b/g;
 const HEX_COLOR = /#[0-9a-fA-F]{3,8}\b/g;
 const RGBA_LITERAL = /\brgba?\(/g;
+const LUCIDE_IMPORT = /import (\w+) from '@lucide\/svelte\/icons\/[\w-]+'/g;
+const ICON_PIXEL_SIZE = /\bsize=\{\d+\}/;
+const ICON_RAW_SIZE = /\bclass="[^"]*\bsize-\d[\w.]*/;
 
 let violations = [];
 
 for (const file of files) {
 	const content = readFileSync(file, 'utf8');
 	const lines = content.split('\n');
+	const icons = [...content.matchAll(LUCIDE_IMPORT)].map((m) => m[1]);
 
 	lines.forEach((line, i) => {
 		const lineNo = i + 1;
@@ -40,6 +44,17 @@ for (const file of files) {
 			}
 		}
 
+		for (const icon of icons) {
+			const tag = line.match(new RegExp(`<${icon}\s[^>]*`));
+			if (!tag) continue;
+			if (ICON_PIXEL_SIZE.test(tag[0])) {
+				violations.push(`${file}:${lineNo} — icono con size={N}: usa una clase size-icon-*`);
+			}
+			if (ICON_RAW_SIZE.test(tag[0])) {
+				violations.push(`${file}:${lineNo} — icono con size-N: usa una clase size-icon-*`);
+			}
+		}
+
 		for (const match of line.matchAll(RAW_ROUNDED)) {
 			violations.push(`${file}:${lineNo} — radio de Tailwind sin tokenizar: \`${match[0]}\``);
 		}