@genexus/mercury 0.35.0 → 1.0.0-beta.1

package/dist/cli/migrate-mercury-tokens.js

@@ -0,0 +1,613 @@
+#!/usr/bin/env node
+// TODO: Add tests for this script.
+// TODO: remove following lines, and fix TS errors.
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-nocheck
+/**
+ * Mercury Design System Token Migration Script
+ * Version: 2.0.0
+ *
+ * USAGE:
+ * Run from your project root: npx mercury update
+ * Rollback changes: npx mercury update --rollback
+ *
+ * The script will:
+ * - Preview all changes (dry-run by default)
+ * - Track primitive tokens (no modifications)
+ * - Ask for confirmation before applying
+ * - Create backups in ./mercury-migration-backup/ folder
+ * - Show you a detailed report of what was changed
+ */
+import fs from "fs";
+import path from "path";
+import { createInterface } from "readline";
+import { migrationToV1Metadata } from "../tokens/migrations/v1.js";
+const MERCURY_PREVIEW_REPORT_FILENAME = "mercury-migration-preview.txt";
+const MERCURY_BACKUP_DIRNAME = "mercury-migration-backup";
+const MIGRATION_REPORT_FILENAME = "migration-report.txt";
+const PRIMITIVE_TOKENS_REPORT_FILENAME = "mercury-primitive-report.txt";
+const UNDERLINE = "\x1b[4m";
+const COLORS = {
+    accentStart: [0, 204, 255], // var(--color-accent-gradient-start)
+    accentEnd: [207, 122, 255], // var(--color-accent-gradient-end)
+    statusWarning: [249, 189, 86], // var(--color-text-status-warning)
+    statusError: [227, 88, 97] // var(--color-text-status-error)
+};
+const reset = "\x1b[0m";
+const colorText = (text, rgb) => `\x1b[38;2;${rgb[0]};${rgb[1]};${rgb[2]}m${text}\x1b[0m`;
+const BULLET = "-";
+// Function to generate a gradient line by type
+function gradientLine() {
+    const length = 80;
+    const char = "/";
+    let line = "";
+    for (let i = 0; i < length; i++) {
+        const t = i / (length - 1); // normalized 0 → 1
+        const r = Math.round(COLORS.accentStart[0] + t * (COLORS.accentEnd[0] - COLORS.accentStart[0]));
+        const g = Math.round(COLORS.accentStart[1] + t * (COLORS.accentEnd[1] - COLORS.accentStart[1]));
+        const b = Math.round(COLORS.accentStart[2] + t * (COLORS.accentEnd[2] - COLORS.accentStart[2]));
+        line += `\x1b[38;2;${r};${g};${b}m${char}`;
+    }
+    return line + reset;
+}
+// ============================================================================
+// TOKEN MAPPINGS - Built from metadata.ts
+// ============================================================================
+/**
+ * Build token migrations object from metadata
+ * Iterates through all sections and subsections to extract before/after mappings
+ */
+function buildTokenMigrationsFromMetadata() {
+    const tokenMigrations = {};
+    migrationToV1Metadata.sections.forEach(section => {
+        // Handle sections with subsections
+        if (section.subsections) {
+            section.subsections.forEach(subsection => {
+                if (subsection.table) {
+                    subsection.table.forEach(row => {
+                        tokenMigrations[row.before] = row.after;
+                    });
+                }
+            });
+        }
+        // Handle sections with direct table (no subsections)
+        else if (section.table) {
+            section.table.forEach(row => {
+                tokenMigrations[row.before] = row.after;
+            });
+        }
+    });
+    return tokenMigrations;
+}
+// Build the migrations from metadata - this is now the source of truth
+const TOKEN_MIGRATIONS = buildTokenMigrationsFromMetadata();
+// Get primitive tokens from metadata
+const PRIMITIVE_TOKENS = migrationToV1Metadata.legacyPrimitiveTokens || [];
+console.log(`\n📋 Loaded ${Object.keys(TOKEN_MIGRATIONS).length} token migrations from metadata`);
+console.log(`📋 Loaded ${PRIMITIVE_TOKENS.length} primitive tokens to track`);
+// ============================================================================
+// CONFIGURATION
+// ============================================================================
+const FILE_EXTENSIONS = [
+    ".css",
+    ".scss",
+    ".sass",
+    ".less",
+    ".js",
+    ".jsx",
+    ".ts",
+    ".tsx",
+    ".vue",
+    ".svelte"
+];
+const EXCLUDE_DIRS = [
+    "node_modules",
+    ".git",
+    "dist",
+    "build",
+    "coverage",
+    ".next",
+    "out",
+    ".nuxt",
+    ".output",
+    ".vercel",
+    ".netlify",
+    "public",
+    "static",
+    "vendor",
+    "www",
+    MERCURY_BACKUP_DIRNAME
+];
+const stats = {
+    filesProcessed: 0,
+    filesModified: 0,
+    tokensReplaced: 0,
+    replacements: {},
+    primitiveTokens: {
+        totalFound: 0,
+        byFile: {} // { filePath: { token: count } }
+    }
+};
+const BACKUP_DIR = path.join(process.cwd(), MERCURY_BACKUP_DIRNAME);
+// ============================================================================
+// HELPER FUNCTIONS
+// ============================================================================
+function shouldExcludeDir(dirPath) {
+    const pathParts = dirPath.split(path.sep);
+    return EXCLUDE_DIRS.some(excludeDir => pathParts.includes(excludeDir));
+}
+function getAllFiles(dirPath, arrayOfFiles = []) {
+    const files = fs.readdirSync(dirPath);
+    files.forEach(file => {
+        const filePath = path.join(dirPath, file);
+        if (fs.statSync(filePath).isDirectory()) {
+            if (!shouldExcludeDir(filePath)) {
+                arrayOfFiles = getAllFiles(filePath, arrayOfFiles);
+            }
+        }
+        else {
+            const ext = path.extname(file);
+            if (FILE_EXTENSIONS.includes(ext)) {
+                arrayOfFiles.push(filePath);
+            }
+        }
+    });
+    return arrayOfFiles;
+}
+function escapeRegex(string) {
+    return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function replaceTokensInContent(content, filePath) {
+    let modifiedContent = content;
+    let fileModified = false;
+    const fileReplacements = {}; // Track replacements per file
+    const filePrimitiveTokens = {}; // Track primitive tokens per file
+    // Sort tokens by length (longest first) to avoid partial replacements
+    const sortedTokens = Object.keys(TOKEN_MIGRATIONS).sort((a, b) => b.length - a.length);
+    sortedTokens.forEach(oldToken => {
+        const newToken = TOKEN_MIGRATIONS[oldToken];
+        // Pattern for var(--token) or var(--token, fallback)
+        const varPattern = new RegExp(`var\\(${escapeRegex(oldToken)}([,)])`, "g");
+        const matches = modifiedContent.match(varPattern);
+        if (matches) {
+            fileModified = true;
+            const count = matches.length;
+            stats.tokensReplaced += count;
+            // Track for global stats
+            if (!stats.replacements[oldToken]) {
+                stats.replacements[oldToken] = { count: 0, files: [] };
+            }
+            stats.replacements[oldToken].count += count;
+            if (!stats.replacements[oldToken].files.includes(filePath)) {
+                stats.replacements[oldToken].files.push(filePath);
+            }
+            // Track for this specific file
+            fileReplacements[oldToken] = {
+                newToken,
+                count
+            };
+            modifiedContent = modifiedContent.replace(varPattern, `var(${newToken}$1`);
+        }
+    });
+    // Check for primitive tokens (no modifications, just tracking)
+    PRIMITIVE_TOKENS.forEach(primitiveToken => {
+        const varPattern = new RegExp(`var\\(${escapeRegex(primitiveToken)}([,)])`, "g");
+        const matches = content.match(varPattern);
+        if (matches) {
+            const count = matches.length;
+            stats.primitiveTokens.totalFound += count;
+            // Track for this specific file
+            filePrimitiveTokens[primitiveToken] = count;
+            // Track globally by file
+            if (!stats.primitiveTokens.byFile[filePath]) {
+                stats.primitiveTokens.byFile[filePath] = {};
+            }
+            stats.primitiveTokens.byFile[filePath][primitiveToken] = count;
+        }
+    });
+    return {
+        modifiedContent,
+        fileModified,
+        fileReplacements,
+        filePrimitiveTokens
+    };
+}
+function createBackup(filePath) {
+    // Calculate relative path from cwd
+    const relativePath = path.relative(process.cwd(), filePath);
+    const backupPath = path.join(BACKUP_DIR, relativePath);
+    // Create parent directories if they don't exist
+    const backupDir = path.dirname(backupPath);
+    if (!fs.existsSync(backupDir)) {
+        fs.mkdirSync(backupDir, { recursive: true });
+    }
+    // Copy file to backup location
+    fs.copyFileSync(filePath, backupPath);
+}
+function analyzeFile(filePath) {
+    try {
+        const content = fs.readFileSync(filePath, "utf8");
+        const { modifiedContent, fileModified, fileReplacements, filePrimitiveTokens } = replaceTokensInContent(content, filePath);
+        stats.filesProcessed++;
+        return {
+            modifiedContent,
+            fileModified,
+            fileReplacements,
+            filePrimitiveTokens
+        };
+    }
+    catch (error) {
+        console.error(`✗ Error: ${path.relative(process.cwd(), filePath)} - ${error.message}`);
+        return {
+            modifiedContent: null,
+            fileModified: false,
+            fileReplacements: {},
+            filePrimitiveTokens: {}
+        };
+    }
+}
+function applyChanges(filePath, modifiedContent) {
+    try {
+        // Create backup in centralized folder
+        createBackup(filePath);
+        // Write modified content
+        fs.writeFileSync(filePath, modifiedContent, "utf8");
+        stats.filesModified++;
+        console.log(`✔ ${path.relative(process.cwd(), filePath)}`);
+    }
+    catch (error) {
+        console.error(`✗ Error: ${path.relative(process.cwd(), filePath)} - ${error.message}`);
+    }
+}
+function generatePreviewReport(fileChanges) {
+    const reportPath = path.join(process.cwd(), MERCURY_PREVIEW_REPORT_FILENAME);
+    let reportContent = "Mercury Design System Token Migration - PREVIEW\n";
+    reportContent += "=".repeat(60) + "\n\n";
+    reportContent += `THIS IS A PREVIEW - No files have been modified yet\n\n`;
+    reportContent += `Generated: ${new Date().toISOString()}\n\n`;
+    reportContent += "=".repeat(60) + "\n\n";
+    reportContent += `SUMMARY\n\n`;
+    reportContent += `Total tokens to replace: ${stats.tokensReplaced}\n`;
+    reportContent += `Total files to modify: ${fileChanges.size}\n\n`;
+    reportContent += "=".repeat(60) + "\n\n";
+    reportContent += `CHANGES BY FILE\n\n`;
+    // Sort files alphabetically for better readability
+    const sortedFiles = Array.from(fileChanges.keys()).sort();
+    sortedFiles.forEach(filePath => {
+        const relativePath = path.relative(process.cwd(), filePath);
+        const { fileReplacements } = fileChanges.get(filePath);
+        reportContent += `${relativePath}\n`;
+        // Sort tokens alphabetically within each file
+        const sortedTokens = Object.keys(fileReplacements).sort();
+        sortedTokens.forEach(oldToken => {
+            const info = fileReplacements[oldToken];
+            const occurrenceText = info.count === 1 ? "occurrence" : "occurrences";
+            reportContent += `  * ${oldToken} → ${info.newToken} (${info.count} ${occurrenceText})\n`;
+        });
+        reportContent += "\n";
+    });
+    reportContent += "=".repeat(60) + "\n";
+    fs.writeFileSync(reportPath, reportContent, "utf8");
+    return reportPath;
+}
+function generatePrimitiveTokensReport() {
+    const reportPath = path.join(process.cwd(), PRIMITIVE_TOKENS_REPORT_FILENAME);
+    let reportContent = "Mercury Design System Token Migration - PRIMITIVE TOKENS REPORT\n";
+    reportContent += "=".repeat(60) + "\n\n";
+    reportContent += `THIS IS A REPORT - No files will be modified\n\n`;
+    reportContent += `Generated: ${new Date().toISOString()}\n\n`;
+    reportContent += "=".repeat(60) + "\n\n";
+    reportContent += `SUMMARY\n\n`;
+    reportContent += `Total primitive tokens found: ${stats.primitiveTokens.totalFound}\n`;
+    reportContent += `No tokens will be modified\n\n`;
+    reportContent += "=".repeat(60) + "\n\n";
+    // Only generate the report if there are primitive tokens found
+    if (stats.primitiveTokens.totalFound > 0) {
+        reportContent += `PRIMITIVE TOKENS BY FILE\n\n`;
+        // Sort files alphabetically
+        const sortedFiles = Object.keys(stats.primitiveTokens.byFile).sort();
+        sortedFiles.forEach(filePath => {
+            const relativePath = path.relative(process.cwd(), filePath);
+            const tokens = stats.primitiveTokens.byFile[filePath];
+            reportContent += `${relativePath}\n`;
+            // Sort tokens alphabetically within each file
+            const sortedTokens = Object.keys(tokens).sort();
+            sortedTokens.forEach(token => {
+                const count = tokens[token];
+                const occurrenceText = count === 1 ? "occurrence" : "occurrences";
+                reportContent += `  * ${token} (${count} ${occurrenceText})\n`;
+            });
+            reportContent += "\n";
+        });
+        reportContent += "=".repeat(60) + "\n";
+    }
+    fs.writeFileSync(reportPath, reportContent, "utf8");
+    return reportPath;
+}
+function generateFinalReport() {
+    console.log("\n" + gradientLine() + "\n");
+    console.log(`${colorText(`${BULLET} Files processed:`, COLORS.accentStart)} ${stats.filesProcessed}`);
+    console.log(`${colorText(`${BULLET} Files modified:`, COLORS.accentStart)} ${stats.filesModified}`);
+    console.log(`${colorText(`${BULLET} Total tokens replaced:`, COLORS.accentStart)} ${stats.tokensReplaced}`);
+    // Save detailed report inside backup folder as txt
+    const reportPath = path.join(BACKUP_DIR, MIGRATION_REPORT_FILENAME);
+    let reportContent = "Mercury Design System Token Migration Report\n";
+    reportContent += "=".repeat(60) + "\n\n";
+    reportContent += `Generated: ${new Date().toISOString()}\n\n`;
+    reportContent += "=".repeat(60) + "\n\n";
+    reportContent += `SUMMARY\n\n`;
+    reportContent += `Files processed: ${stats.filesProcessed}\n`;
+    reportContent += `Files modified: ${stats.filesModified}\n`;
+    reportContent += `Total tokens replaced: ${stats.tokensReplaced}\n\n`;
+    reportContent += "=".repeat(60) + "\n\n";
+    reportContent += `CHANGES BY FILE\n\n`;
+    // Build a file-centric view from stats.replacements
+    const fileMap = new Map();
+    // Reorganize data by file
+    Object.keys(stats.replacements).forEach(oldToken => {
+        const data = stats.replacements[oldToken];
+        const newToken = TOKEN_MIGRATIONS[oldToken];
+        data.files.forEach(filePath => {
+            if (!fileMap.has(filePath)) {
+                fileMap.set(filePath, []);
+            }
+            fileMap.get(filePath).push({
+                oldToken,
+                newToken
+                // Note: we don't have per-file counts in stats.replacements
+                // so we'll just show that it was replaced
+            });
+        });
+    });
+    // Sort files alphabetically
+    const sortedFiles = Array.from(fileMap.keys()).sort();
+    sortedFiles.forEach(filePath => {
+        const relativePath = path.relative(process.cwd(), filePath);
+        const tokens = fileMap.get(filePath);
+        reportContent += `${relativePath}\n`;
+        // Sort tokens alphabetically
+        tokens.sort((a, b) => a.oldToken.localeCompare(b.oldToken));
+        tokens.forEach(({ oldToken, newToken }) => {
+            reportContent += `  * ${oldToken} → ${newToken}\n`;
+        });
+        reportContent += "\n";
+    });
+    reportContent += "=".repeat(60) + "\n";
+    fs.writeFileSync(reportPath, reportContent, "utf8");
+}
+function displayPreviewSummary(fileCount) {
+    console.log(`${BULLET} Total tokens to replace: ${stats.tokensReplaced}`);
+    console.log(`${BULLET} Total files to modify: ${fileCount}`);
+}
+// ============================================================================
+// ROLLBACK FUNCTION
+// ============================================================================
+function rollbackFromBackup() {
+    console.log("\n🔄 Rolling back changes from backup...\n");
+    if (!fs.existsSync(BACKUP_DIR)) {
+        console.error(`❌ Error: No backup found at ./${MERCURY_BACKUP_DIRNAME}/`);
+        console.log("💡 Nothing to rollback. Run migration first with: npx mercury update");
+        process.exit(1);
+    }
+    const readline = createInterface({
+        input: process.stdin,
+        output: process.stdout
+    });
+    readline.question("⚠️  This will restore all files from the backup. Continue? [y/N]: ", answer => {
+        if (answer.toLowerCase() === "y" || answer.toLowerCase() === "yes") {
+            console.log("\n📦 Restoring files...\n");
+            let filesRestored = 0;
+            function restoreFiles(backupPath) {
+                const items = fs.readdirSync(backupPath);
+                items.forEach(item => {
+                    const backupItemPath = path.join(backupPath, item);
+                    const relativePath = path.relative(BACKUP_DIR, backupItemPath);
+                    const originalPath = path.join(process.cwd(), relativePath);
+                    if (fs.statSync(backupItemPath).isDirectory()) {
+                        restoreFiles(backupItemPath);
+                    }
+                    else if (item !== MIGRATION_REPORT_FILENAME) {
+                        // Skip the report file
+                        fs.copyFileSync(backupItemPath, originalPath);
+                        filesRestored++;
+                        console.log(`✔ ${relativePath}`);
+                    }
+                });
+            }
+            restoreFiles(BACKUP_DIR);
+            console.log(`\n✅ Rollback complete! Restored ${filesRestored} file(s)`);
+            // Remove the backup folder after successful rollback
+            console.log("\n🗑️  Removing backup folder...");
+            fs.rmSync(BACKUP_DIR, { recursive: true, force: true });
+            console.log("\n✔ Backup folder removed");
+        }
+        else {
+            console.log("\n🚨 Rollback cancelled.");
+        }
+        readline.close();
+    });
+}
+// ============================================================================
+// HEADER PRINTING FUNCTION
+// ============================================================================
+function lerp(a, b, t) {
+    return Math.round(a + (b - a) * t);
+}
+function gradientText(text, startColor, endColor) {
+    const [r1, g1, b1] = startColor;
+    const [r2, g2, b2] = endColor;
+    let result = "";
+    for (let i = 0; i < text.length; i++) {
+        const t = i / (text.length - 1);
+        const r = lerp(r1, r2, t);
+        const g = lerp(g1, g2, t);
+        const b = lerp(b1, b2, t);
+        result += `\x1b[38;2;${r};${g};${b}m${text[i]}`;
+    }
+    // Reset color at the end
+    return result + "\x1b[0m";
+}
+function printHeader() {
+    const asciiLines = [
+        "  __  __                                  _____     _                    __  __ _                 _             ",
+        " |  \\/  | ___ _ __ ___ _   _ _ __ _   _  |_   _|__ | | _____ _ __  ___  |  \\/  (_) __ _ _ __ __ _| |_ ___  _ __ ",
+        " | |\\/| |/ _ \\ '__/ __| | | | '__| | | |   | |/ _ \\| |/ / _ \\ '_ \\/ __| | |\\/| | |/ _` | '__/ _` | __/ _ \\| '__|",
+        " | |  | |  __/ | | (__| |_| | |  | |_| |   | | (_) |   <  __/ | | \\__ \\ | |  | | | (_| | | | (_| | || (_) | |   ",
+        " |_|  |_|\\___|_|  \\___|\\__,_|_|   \\__, |   |_|\\___/|_|\\_\\___|_| |_|___/ |_|  |_|_|\\__, |_|  \\__,_|\\__\\___/|_|   ",
+        "                                  |___/                                           |___/                          ",
+        ""
+    ];
+    console.log("");
+    asciiLines.forEach(line => console.log(gradientText(line, COLORS.accentStart, COLORS.accentEnd)));
+    console.log("");
+}
+// ============================================================================
+// MAIN FUNCTION
+// ============================================================================
+export function migrateMercuryTokens() {
+    printHeader();
+    console.log(gradientLine());
+    // Handle command parsing
+    const args = process.argv.slice(2);
+    const hasRollback = args.includes("--rollback");
+    // Handle rollback
+    if (hasRollback) {
+        rollbackFromBackup();
+        return;
+    }
+    // Determine target directory
+    // Filter out "update" command if present, as it's the default command
+    const filteredArgs = args.filter(arg => arg !== "update");
+    const targetDir = filteredArgs[0] || process.cwd();
+    if (!fs.existsSync(targetDir)) {
+        console.error(`\n❌ Error: Directory "${targetDir}" does not exist`);
+        process.exit(1);
+    }
+    console.log(`\n${colorText(`${BULLET} Target:`, COLORS.accentStart)} ${targetDir}`);
+    console.log(`${colorText(`${BULLET} File types:`, COLORS.accentStart)} ${FILE_EXTENSIONS.join(", ")}`);
+    console.log(`${colorText(`${BULLET} Excluding:`, COLORS.accentStart)} ${EXCLUDE_DIRS.join(", ")}`);
+    console.log(`${colorText(`Scanning files...`, COLORS.accentEnd)}`);
+    const files = getAllFiles(targetDir);
+    console.log(`\n✔ Found ${files.length} file(s) to scan`);
+    if (files.length === 0) {
+        console.log("\n⚠️  No files found to migrate. Exiting.");
+        process.exit(0);
+    }
+    // Phase 1: DRY RUN - Analyze all files
+    console.log("\n" + gradientLine() + "\n");
+    console.log("PHASE 1: Preview Changes (Dry-Run)");
+    console.log("\n⳿ Analyzing files (No changes will be applied at this stage)...");
+    const fileChanges = new Map();
+    let processedCount = 0;
+    files.forEach(file => {
+        const { modifiedContent, fileModified, fileReplacements } = analyzeFile(file);
+        if (fileModified) {
+            fileChanges.set(file, { modifiedContent, fileReplacements });
+        }
+        // Show progress indicator
+        processedCount++;
+        if (processedCount % 10 === 0 || processedCount === files.length) {
+            process.stdout.write(`\r⳿ Analyzing: ${processedCount}/${files.length} files...`);
+        }
+    });
+    // Clear the progress line
+    process.stdout.write("\r" + " ".repeat(60) + "\r");
+    if (fileChanges.size === 0) {
+        console.log("\n✔ No changes needed - all tokens are up to date!");
+        process.exit(0);
+    }
+    // Display preview summary
+    displayPreviewSummary(fileChanges.size);
+    // Generate preview report
+    const previewReportPath = generatePreviewReport(fileChanges);
+    // Generate primitive tokens report silently if any were found
+    let primitiveReportPath = null;
+    if (stats.primitiveTokens.totalFound > 0) {
+        primitiveReportPath = generatePrimitiveTokensReport();
+    }
+    console.log(`\n📄 A preview of the proposed changes has been saved: ${UNDERLINE}${colorText(path.relative(process.cwd(), previewReportPath), COLORS.accentStart)}${reset}`);
+    console.log(`👉 Next steps:`);
+    console.log(`- 1. Review the preview report to see what will change`);
+    console.log(`- 2. Answer the prompt below to continue or cancel`);
+    // Phase 2: Confirmation
+    const readline = createInterface({
+        input: process.stdin,
+        output: process.stdout
+    });
+    const applyChangesPrompt = `\n⚠️  Apply these changes? Backups will be saved to ./${MERCURY_BACKUP_DIRNAME}/ [y/N]: `;
+    readline.question(colorText(applyChangesPrompt, COLORS.statusWarning), answer => {
+        if (answer.toLowerCase() === "y" || answer.toLowerCase() === "yes") {
+            // Phase 3: Apply changes
+            console.log("\n" + gradientLine() + "\n");
+            console.log("PHASE 2: Applying Changes");
+            console.log("\n⳿ Creating backups and applying changes...\n");
+            // Create backup directory
+            if (!fs.existsSync(BACKUP_DIR)) {
+                fs.mkdirSync(BACKUP_DIR, { recursive: true });
+            }
+            // Reset stats for final count
+            stats.filesModified = 0;
+            // Apply all changes
+            fileChanges.forEach((data, filePath) => {
+                applyChanges(filePath, data.modifiedContent);
+            });
+            generateFinalReport();
+            console.log("\n✅ Migration complete!");
+            const reportPath = path.join(BACKUP_DIR, MIGRATION_REPORT_FILENAME);
+            const reportRelPath = path.relative(process.cwd(), reportPath);
+            console.log("\n👉 Next steps:\n");
+            console.log(`1. Review the migration report: ${UNDERLINE}${colorText(reportRelPath, COLORS.accentStart)}${reset}\n`);
+            console.log("2. Test your application thoroughly\n");
+            // Only show primitive tokens step if they were found
+            if (stats.primitiveTokens.totalFound > 0) {
+                console.log(`3. Review the primitive color tokens report (${UNDERLINE}${colorText(PRIMITIVE_TOKENS_REPORT_FILENAME, COLORS.accentStart)}${reset}) and update them manually using the new semantic color tokens documented in the showcase (Core concepts → Tokens)\n`);
+            }
+            console.log(`4. ✓ When everything works, delete the backup: ${colorText(`rm -rf ${MERCURY_BACKUP_DIRNAME}`, COLORS.accentEnd)} (Backups saved in: ${UNDERLINE}${colorText(MERCURY_BACKUP_DIRNAME, COLORS.accentStart)}${reset})\n`);
+            console.log(`5. ↩ If needed, rollback with: ${colorText("npx mercury update --rollback", COLORS.accentEnd)}`);
+            // Delete preview report after successful migration
+            if (fs.existsSync(previewReportPath)) {
+                fs.unlinkSync(previewReportPath);
+            }
+            // DO NOT delete primitive tokens report - user needs it for manual updates
+            readline.close();
+        }
+        else {
+            const migrationCancelledPrompt = `\n🚨 Migration cancelled. No files were modified.`;
+            console.log(migrationCancelledPrompt);
+            // Ask if user wants to keep the reports
+            const previewReportPathText = path.relative(process.cwd(), previewReportPath);
+            // Build the prompt message based on whether primitive tokens were found
+            let keepReportsPrompt = `\n⚠️  Do you want to keep the reports (${MERCURY_PREVIEW_REPORT_FILENAME}`;
+            if (primitiveReportPath && stats.primitiveTokens.totalFound > 0) {
+                keepReportsPrompt += ` and ${PRIMITIVE_TOKENS_REPORT_FILENAME}`;
+            }
+            keepReportsPrompt += `)? [y/N]: `;
+            readline.question(colorText(keepReportsPrompt, COLORS.statusWarning), keepReports => {
+                if (keepReports.toLowerCase() === "y" ||
+                    keepReports.toLowerCase() === "yes") {
+                    console.log(`\n📄 Preview report saved at: ${UNDERLINE}${colorText(previewReportPathText, COLORS.accentStart)}${reset}`);
+                    if (primitiveReportPath && stats.primitiveTokens.totalFound > 0) {
+                        console.log(`📄 Primitive tokens report saved at: ${UNDERLINE}${colorText(path.relative(process.cwd(), primitiveReportPath), COLORS.accentStart)}${reset}`);
+                    }
+                    console.log("");
+                }
+                else {
+                    // Delete preview report
+                    if (fs.existsSync(previewReportPath)) {
+                        fs.unlinkSync(previewReportPath);
+                        console.log(`\n🗑️  ${MERCURY_PREVIEW_REPORT_FILENAME} was deleted`);
+                    }
+                    // Delete primitive tokens report if it exists
+                    if (primitiveReportPath &&
+                        fs.existsSync(primitiveReportPath) &&
+                        stats.primitiveTokens.totalFound > 0) {
+                        fs.unlinkSync(primitiveReportPath);
+                        console.log(`🗑️  ${PRIMITIVE_TOKENS_REPORT_FILENAME} was deleted`);
+                    }
+                    console.log("");
+                }
+                readline.close();
+            });
+        }
+    });
+}

package/dist/components/chat/code-block.lit.js

@@ -5,5 +5,5 @@ const downloadCodeBlockCallback = (plainText, language, downloadCodeBlock) => ()
 export const customCodeBlockRender = (chatRef) => (options) => {
     const { accessibleName, text } = chatRef.translations;
     const downloadCb = chatRef.callbacks?.downloadCodeBlock;
-    return html `<div part="code-block"><div part="code-block__header"><span part="code-block__header-caption">${options.language}</span><div part="code-block__header-actions"><button class="button-copy-code" aria-label="${text.copyCodeButton}" part="code-block__button--icon-only code-block__copy-code-button" type="button" @click="${(e) => copyButtonClickHandler(e, options.plainText)}"></button> ${when(downloadCb, () => html `<button aria-label="${accessibleName.downloadCodeButton}" part="code-block__button--icon-only code-block__download-code-button" @click="${downloadCodeBlockCallback(options.plainText, options.language, downloadCb)}"></button>`)}</div></div><ch-code .language="${options.language}" .lastNestedChildClass="${options.lastNestedChildClass}" part="code-block__content" .showIndicator="${options.showIndicator}" .value="${options.plainText}"></ch-code></div>`;
+    return html `<div part="code-block"><div part="code-block__header"><span part="code-block__header-caption">${options.language ?? "txt"}</span><div part="code-block__header-actions"><button class="button-copy-code" aria-label="${text.copyCodeButton}" part="code-block__button--icon-only code-block__copy-code-button" type="button" @click="${(e) => copyButtonClickHandler(e, options.plainText)}"></button> ${when(downloadCb, () => html `<button aria-label="${accessibleName.downloadCodeButton}" part="code-block__button--icon-only code-block__download-code-button" @click="${downloadCodeBlockCallback(options.plainText, options.language, downloadCb)}"></button>`)}</div></div><ch-code .language="${options.language}" .lastNestedChildClass="${options.lastNestedChildClass}" part="code-block__content" .showIndicator="${options.showIndicator}" .value="${options.plainText}"></ch-code></div>`;
 };

package/dist/components/chat/file.lit.js

@@ -36,7 +36,7 @@ const fileFooter = (file, fileFormat) => {
         [`file-footer format-${fileFormat} ${file.mimeType} ${file.uploadState ?? DEFAULT_FILE_UPLOAD_STATE}`]: true,
         [file.extension]: !!file.extension,
         [file.parts]: !!file.parts
-    })}"><span class="body-regular-xs" part="file-caption">${file.caption}${file.extension && "." + file.extension.toLowerCase()} </span>${file.uploadState === "in-progress"
+    })}"><span part="file-caption">${file.caption}${file.extension && "." + file.extension.toLowerCase()} </span>${file.uploadState === "in-progress"
         ? html `<mer-spinner></mer-spinner>`
         : nothing}</div>`;
 };

package/dist/components/chat/mer-animated-dots.js

@@ -18,26 +18,27 @@ export class MerAnimatedDots extends LitElement {
       border-radius: calc(var(--dot-size) / 2);
       opacity: var(--dot-initial-opacity);
       transform: scale(var(--dot-initial-scale));
-      animation: animateDot var(--animation-duration) ease-in-out infinite alternate;
+      animation: animateDot var(--animation-duration) ease-in-out infinite
+        alternate;
     }
     .dot:first-child {
       background-color: var(
         --chat-avatar-waiting-dot-1-color,
-        var(--mer-color__chat-awaiting-dot-1)
+        var(--color-accent-gradient-start)
       );
     }
     .dot:nth-child(2) {
       animation-delay: calc(var(--animation-duration) / 3);
       background-color: var(
         --chat-avatar-waiting-dot-2-color,
-        var(--mer-color__chat-awaiting-dot-2)
+        var(--color-accent-gradient-middle)
       );
     }
     .dot:nth-child(3) {
       animation-delay: calc(var(--animation-duration) / 1.5);
       background-color: var(
         --chat-avatar-waiting-dot-3-color,
-        var(--mer-color__chat-awaiting-dot-3)
+        var(--color-accent-gradient-end)
       );
     }
 

package/dist/components/chat/mer-spinner.lit.js

@@ -1,6 +1,6 @@
 import { LitElement, css, html } from "lit";
 export class MerSpinner extends LitElement {
-    static styles = css `:host{--spinner-size:var(--mer-spacing--md);--spinner-color:var(--mer-color__primary--300);--track-color:var(--mer-color__tinted-primary--50);--border-thinness:7;inline-size:var(--spinner-size);block-size:var(--spinner-size);border:calc(var(--spinner-size)/ var(--border-thinness)) solid var(--track-color);border-block-start:calc(var(--spinner-size)/ var(--border-thinness)) solid var(--spinner-color);border-radius:50%;animation:spin var(--mer-timing--regular,1s) linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}`;
+    static styles = css `:host{--spinner-size:var(--size-16);--spinner-color:var(--color-border-primary-light);--track-color:var(--color-border-primary-pressed);--border-thinness:7;inline-size:var(--spinner-size);block-size:var(--spinner-size);border:calc(var(--spinner-size)/ var(--border-thinness)) solid var(--track-color);border-block-start:calc(var(--spinner-size)/ var(--border-thinness)) solid var(--spinner-color);border-radius:50%;animation:spin var(--timing-regular,1s) linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}`;
     render() {
         return html ``;
     }