170 lines
6.6 KiB
JavaScript
170 lines
6.6 KiB
JavaScript
#!/usr/bin/env node
|
|
/**
|
|
* Script pour remplacer les couleurs hardcodées par des tokens CSS
|
|
* Usage: node scripts/refactor-colors.mjs
|
|
*/
|
|
|
|
import { readFileSync, writeFileSync, readdirSync, statSync } from 'fs';
|
|
import { join, extname } from 'path';
|
|
|
|
// Mapping des classes Tailwind hardcodées vers les tokens
|
|
const COLOR_REPLACEMENTS = [
|
|
// Dark mode backgrounds
|
|
{ from: /\bdark:bg-slate-700\b/g, to: 'dark:bg-surface2' },
|
|
{ from: /\bdark:bg-slate-800\b/g, to: 'dark:bg-card' },
|
|
{ from: /\bdark:bg-slate-900\b/g, to: 'dark:bg-main' },
|
|
{ from: /\bdark:bg-gray-700\b/g, to: 'dark:bg-surface2' },
|
|
{ from: /\bdark:bg-gray-800\b/g, to: 'dark:bg-card' },
|
|
{ from: /\bdark:bg-gray-900\b/g, to: 'dark:bg-main' },
|
|
{ from: /\bdark:bg-zinc-700\b/g, to: 'dark:bg-surface2' },
|
|
{ from: /\bdark:bg-zinc-800\b/g, to: 'dark:bg-card' },
|
|
{ from: /\bdark:bg-zinc-900\b/g, to: 'dark:bg-main' },
|
|
|
|
// Dark mode text
|
|
{ from: /\bdark:text-slate-200\b/g, to: 'dark:text-main' },
|
|
{ from: /\bdark:text-slate-300\b/g, to: 'dark:text-main' },
|
|
{ from: /\bdark:text-slate-400\b/g, to: 'dark:text-muted' },
|
|
{ from: /\bdark:text-gray-200\b/g, to: 'dark:text-main' },
|
|
{ from: /\bdark:text-gray-300\b/g, to: 'dark:text-main' },
|
|
{ from: /\bdark:text-gray-400\b/g, to: 'dark:text-muted' },
|
|
{ from: /\bdark:text-zinc-200\b/g, to: 'dark:text-main' },
|
|
{ from: /\bdark:text-zinc-300\b/g, to: 'dark:text-main' },
|
|
{ from: /\bdark:text-zinc-400\b/g, to: 'dark:text-muted' },
|
|
|
|
// Dark mode borders
|
|
{ from: /\bdark:border-slate-600\b/g, to: 'dark:border-border' },
|
|
{ from: /\bdark:border-slate-700\b/g, to: 'dark:border-border' },
|
|
{ from: /\bdark:border-gray-600\b/g, to: 'dark:border-border' },
|
|
{ from: /\bdark:border-gray-700\b/g, to: 'dark:border-border' },
|
|
{ from: /\bdark:border-zinc-600\b/g, to: 'dark:border-border' },
|
|
{ from: /\bdark:border-zinc-700\b/g, to: 'dark:border-border' },
|
|
|
|
// Dark hover states
|
|
{ from: /\bdark:hover:bg-slate-700\b/g, to: 'dark:hover:bg-surface2' },
|
|
{ from: /\bdark:hover:bg-slate-800\b/g, to: 'dark:hover:bg-card' },
|
|
{ from: /\bdark:hover:bg-gray-700\b/g, to: 'dark:hover:bg-surface2' },
|
|
{ from: /\bdark:hover:bg-gray-800\b/g, to: 'dark:hover:bg-card' },
|
|
{ from: /\bdark:hover:text-slate-200\b/g, to: 'dark:hover:text-main' },
|
|
{ from: /\bdark:hover:text-gray-200\b/g, to: 'dark:hover:text-main' },
|
|
|
|
// Backgrounds
|
|
{ from: /\bbg-slate-50\b/g, to: 'bg-surface1' },
|
|
{ from: /\bbg-slate-100\b/g, to: 'bg-surface1' },
|
|
{ from: /\bbg-slate-200\b/g, to: 'bg-surface2' },
|
|
{ from: /\bbg-slate-300\b/g, to: 'bg-muted' },
|
|
{ from: /\bbg-gray-50\b/g, to: 'bg-surface1' },
|
|
{ from: /\bbg-gray-100\b/g, to: 'bg-surface1' },
|
|
{ from: /\bbg-gray-200\b/g, to: 'bg-surface2' },
|
|
{ from: /\bbg-gray-300\b/g, to: 'bg-muted' },
|
|
{ from: /\bbg-gray-800\b/g, to: 'bg-card' },
|
|
{ from: /\bbg-gray-900\b/g, to: 'bg-main' },
|
|
{ from: /\bbg-zinc-50\b/g, to: 'bg-surface1' },
|
|
{ from: /\bbg-zinc-100\b/g, to: 'bg-surface1' },
|
|
{ from: /\bbg-zinc-800\b/g, to: 'bg-card' },
|
|
{ from: /\bbg-zinc-900\b/g, to: 'bg-main' },
|
|
{ from: /\bbg-white\b/g, to: 'bg-card' },
|
|
|
|
// Text colors
|
|
{ from: /\btext-slate-400\b/g, to: 'text-muted' },
|
|
{ from: /\btext-slate-500\b/g, to: 'text-muted' },
|
|
{ from: /\btext-slate-600\b/g, to: 'text-muted' },
|
|
{ from: /\btext-slate-700\b/g, to: 'text-main' },
|
|
{ from: /\btext-slate-800\b/g, to: 'text-main' },
|
|
{ from: /\btext-slate-900\b/g, to: 'text-main' },
|
|
{ from: /\btext-gray-400\b/g, to: 'text-muted' },
|
|
{ from: /\btext-gray-500\b/g, to: 'text-muted' },
|
|
{ from: /\btext-gray-600\b/g, to: 'text-muted' },
|
|
{ from: /\btext-gray-700\b/g, to: 'text-main' },
|
|
{ from: /\btext-gray-800\b/g, to: 'text-main' },
|
|
{ from: /\btext-gray-900\b/g, to: 'text-main' },
|
|
{ from: /\btext-zinc-400\b/g, to: 'text-muted' },
|
|
{ from: /\btext-zinc-500\b/g, to: 'text-muted' },
|
|
{ from: /\btext-zinc-600\b/g, to: 'text-muted' },
|
|
{ from: /\btext-zinc-700\b/g, to: 'text-main' },
|
|
{ from: /\btext-zinc-800\b/g, to: 'text-main' },
|
|
{ from: /\btext-zinc-900\b/g, to: 'text-main' },
|
|
|
|
// Borders
|
|
{ from: /\bborder-slate-200\b/g, to: 'border-border' },
|
|
{ from: /\bborder-slate-300\b/g, to: 'border-border' },
|
|
{ from: /\bborder-gray-200\b/g, to: 'border-border' },
|
|
{ from: /\bborder-gray-300\b/g, to: 'border-border' },
|
|
{ from: /\bborder-zinc-200\b/g, to: 'border-border' },
|
|
{ from: /\bborder-zinc-300\b/g, to: 'border-border' },
|
|
|
|
// Hover states
|
|
{ from: /\bhover:bg-slate-100\b/g, to: 'hover:bg-surface1' },
|
|
{ from: /\bhover:bg-slate-200\b/g, to: 'hover:bg-surface2' },
|
|
{ from: /\bhover:bg-gray-100\b/g, to: 'hover:bg-surface1' },
|
|
{ from: /\bhover:bg-gray-200\b/g, to: 'hover:bg-surface2' },
|
|
{ from: /\bhover:bg-zinc-100\b/g, to: 'hover:bg-surface1' },
|
|
{ from: /\bhover:text-slate-900\b/g, to: 'hover:text-main' },
|
|
{ from: /\bhover:text-gray-900\b/g, to: 'hover:text-main' },
|
|
|
|
// Focus states
|
|
{ from: /\bfocus:border-slate-400\b/g, to: 'focus:border-primary' },
|
|
{ from: /\bfocus:border-gray-400\b/g, to: 'focus:border-primary' },
|
|
{ from: /\bfocus:ring-slate-500\b/g, to: 'focus:ring-ring' },
|
|
{ from: /\bfocus:ring-gray-500\b/g, to: 'focus:ring-ring' },
|
|
];
|
|
|
|
function processFile(filePath) {
|
|
try {
|
|
let content = readFileSync(filePath, 'utf-8');
|
|
let modified = false;
|
|
|
|
for (const { from, to } of COLOR_REPLACEMENTS) {
|
|
if (from.test(content)) {
|
|
content = content.replace(from, to);
|
|
modified = true;
|
|
}
|
|
}
|
|
|
|
if (modified) {
|
|
writeFileSync(filePath, content, 'utf-8');
|
|
console.log(`✓ Updated: ${filePath}`);
|
|
return 1;
|
|
}
|
|
|
|
return 0;
|
|
} catch (error) {
|
|
console.error(`✗ Error processing ${filePath}:`, error.message);
|
|
return 0;
|
|
}
|
|
}
|
|
|
|
function walkDirectory(dir, extensions = ['.ts', '.html']) {
|
|
let filesUpdated = 0;
|
|
|
|
const items = readdirSync(dir);
|
|
|
|
for (const item of items) {
|
|
const fullPath = join(dir, item);
|
|
const stat = statSync(fullPath);
|
|
|
|
if (stat.isDirectory()) {
|
|
// Skip node_modules, .angular, dist, etc.
|
|
if (!['node_modules', '.angular', 'dist', '.git'].includes(item)) {
|
|
filesUpdated += walkDirectory(fullPath, extensions);
|
|
}
|
|
} else if (stat.isFile()) {
|
|
const ext = extname(fullPath);
|
|
if (extensions.includes(ext)) {
|
|
filesUpdated += processFile(fullPath);
|
|
}
|
|
}
|
|
}
|
|
|
|
return filesUpdated;
|
|
}
|
|
|
|
// Main execution
|
|
const srcDir = join(process.cwd(), 'src');
|
|
console.log('🎨 Starting color refactoring...\n');
|
|
console.log(`Scanning: ${srcDir}\n`);
|
|
|
|
const filesUpdated = walkDirectory(srcDir);
|
|
|
|
console.log(`\n✨ Refactoring complete!`);
|
|
console.log(`📝 Files updated: ${filesUpdated}`);
|