From 71b33fcf620020a28eb578062fb2ba646afa61b4 Mon Sep 17 00:00:00 2001 From: saravanakumardb1 Date: Wed, 4 Mar 2026 19:54:40 -0800 Subject: [PATCH] feat(design-tokens): add SSO brand color tokens --- .../design-tokens/generated/MindLystTokens.kt | 8 ++ packages/design-tokens/generated/tokens.ts | 8 ++ .../{token-coverage.js => token-coverage.cjs} | 0 .../design-tokens/scripts/validate-tokens.js | 110 ------------------ .../design-tokens/tokens/bytelyst.tokens.json | 12 +- 5 files changed, 27 insertions(+), 111 deletions(-) rename packages/design-tokens/scripts/{token-coverage.js => token-coverage.cjs} (100%) delete mode 100755 packages/design-tokens/scripts/validate-tokens.js diff --git a/packages/design-tokens/generated/MindLystTokens.kt b/packages/design-tokens/generated/MindLystTokens.kt index cbcfc9ba..20c4faf4 100644 --- a/packages/design-tokens/generated/MindLystTokens.kt +++ b/packages/design-tokens/generated/MindLystTokens.kt @@ -28,6 +28,14 @@ object MindLystTokens { const val GOLD = 0xFFFFD166 const val MINT = 0xFF34D399 const val WARNING = 0xFFF59E0B + const val MICROSOFTRED = 0xFFF25022 + const val MICROSOFTGREEN = 0xFF7FBA00 + const val MICROSOFTBLUE = 0xFF00A4EF + const val MICROSOFTYELLOW = 0xFFFFB900 + const val GOOGLEBLUE = 0xFF4285F4 + const val GOOGLEGREEN = 0xFF34A853 + const val GOOGLEYELLOW = 0xFFFBBC05 + const val GOOGLERED = 0xFFEA4335 } // ── Semantic Colors (Dark Theme) ───────────────────────────────── diff --git a/packages/design-tokens/generated/tokens.ts b/packages/design-tokens/generated/tokens.ts index aa7c6753..bb9e458c 100644 --- a/packages/design-tokens/generated/tokens.ts +++ b/packages/design-tokens/generated/tokens.ts @@ -30,6 +30,14 @@ export const tokens = { gold: '#FFD166', mint: '#34D399', warning: '#F59E0B', + microsoftRed: '#F25022', + microsoftGreen: '#7FBA00', + microsoftBlue: '#00A4EF', + microsoftYellow: '#FFB900', + googleBlue: '#4285F4', + googleGreen: '#34A853', + googleYellow: '#FBBC05', + googleRed: '#EA4335', }, }, semantic: { diff --git a/packages/design-tokens/scripts/token-coverage.js b/packages/design-tokens/scripts/token-coverage.cjs similarity index 100% rename from packages/design-tokens/scripts/token-coverage.js rename to packages/design-tokens/scripts/token-coverage.cjs diff --git a/packages/design-tokens/scripts/validate-tokens.js b/packages/design-tokens/scripts/validate-tokens.js deleted file mode 100755 index b234c261..00000000 --- a/packages/design-tokens/scripts/validate-tokens.js +++ /dev/null @@ -1,110 +0,0 @@ -#!/usr/bin/env node -/** - * Token validation script — checks for hardcoded colors in source files - * and reports token coverage per product. - * - * Usage: node scripts/validate-tokens.js [product-path] - */ - -const { readFileSync, readdirSync, statSync } = require('fs'); -const { join, resolve } = require('path'); - -const HARD_COLOR_REGEX = /#[0-9A-Fa-f]{3,8}\b|rgb\([^)]+\)|rgba\([^)]+\)|hsl\([^)]+\)/g; -const EXCLUDED_DIRS = ['node_modules', 'dist', 'build', '.git', 'generated', '__mocks__']; -const INCLUDED_EXTENSIONS = ['.ts', '.tsx', '.js', '.jsx', '.swift', '.kt']; - -function findFiles(dir, files = []) { - try { - const items = readdirSync(dir); - for (const item of items) { - const fullPath = join(dir, item); - if (EXCLUDED_DIRS.some(ex => fullPath.includes(ex))) continue; - - const stat = statSync(fullPath); - if (stat.isDirectory()) { - findFiles(fullPath, files); - } else if (INCLUDED_EXTENSIONS.some(ext => item.endsWith(ext))) { - files.push(fullPath); - } - } - } catch (e) { - // Directory might not exist or be accessible - } - return files; -} - -function analyzeFile(filePath) { - const content = readFileSync(filePath, 'utf-8'); - const lines = content.split('\n'); - const issues = []; - - lines.forEach((line, index) => { - // Skip comments - if (line.trim().startsWith('//') || line.trim().startsWith('*') || line.trim().startsWith('/*')) - return; - - const matches = line.match(HARD_COLOR_REGEX); - if (matches) { - // Filter out legitimate uses (like transparency values) - const suspicious = matches.filter(m => { - if (m.startsWith('#') && (m.length === 9 || m.length === 5)) return false; // Skip alpha hex - if (m.includes('0.0') || m.includes('1.0')) return false; // Skip clear/opaque - return true; - }); - - if (suspicious.length > 0) { - issues.push({ - line: index + 1, - colors: suspicious, - content: line.trim().slice(0, 80), - }); - } - } - }); - - return issues; -} - -function main() { - const targetPath = process.argv[2] || '.'; - const absolutePath = resolve(targetPath); - - console.log(`🔍 Scanning ${absolutePath} for hardcoded colors...\n`); - - const files = findFiles(absolutePath); - let totalIssues = 0; - let filesWithIssues = 0; - - for (const file of files) { - const issues = analyzeFile(file); - if (issues.length > 0) { - filesWithIssues++; - totalIssues += issues.length; - const relativePath = file.replace(absolutePath, '').slice(1); - console.log(`\n📄 ${relativePath}`); - issues.forEach(issue => { - console.log(` Line ${issue.line}: ${issue.colors.join(', ')}`); - console.log(` ${issue.content}`); - }); - } - } - - console.log(`\n${'='.repeat(60)}`); - console.log(`📊 Summary:`); - console.log(` Files scanned: ${files.length}`); - console.log(` Files with hardcoded colors: ${filesWithIssues}`); - console.log(` Total hardcoded colors found: ${totalIssues}`); - - if (totalIssues > 0) { - console.log(`\n⚠️ Consider replacing hardcoded colors with design tokens:`); - console.log(` Web: var(--ml-) from @bytelyst/design-tokens`); - console.log(` iOS: MindLystColors.dark / MindLystColors.light`); - console.log(` KMP: MindLystTokens.Dark. / MindLystTokens.Light.`); - process.exit(1); - } else { - console.log(`\n✅ No hardcoded colors found! All colors use design tokens.`); - process.exit(0); - } -} - -main(); diff --git a/packages/design-tokens/tokens/bytelyst.tokens.json b/packages/design-tokens/tokens/bytelyst.tokens.json index da9c470a..52d08df6 100644 --- a/packages/design-tokens/tokens/bytelyst.tokens.json +++ b/packages/design-tokens/tokens/bytelyst.tokens.json @@ -27,7 +27,17 @@ "coral": "#FF6E6E", "gold": "#FFD166", "mint": "#34D399", - "warning": "#F59E0B" + "warning": "#F59E0B", + + "microsoftRed": "#F25022", + "microsoftGreen": "#7FBA00", + "microsoftBlue": "#00A4EF", + "microsoftYellow": "#FFB900", + + "googleBlue": "#4285F4", + "googleGreen": "#34A853", + "googleYellow": "#FBBC05", + "googleRed": "#EA4335" } }, "semantic": {