feat: unify pastel application into single playground and remove standalone pages

lib/pastel/utils/color.ts

@@ -1,30 +1,3 @@
-/**
- * Calculate relative luminance of a color
- * Based on WCAG 2.1 specification
- */
-export function getRelativeLuminance(r: number, g: number, b: number): number {
-  const [rs, gs, bs] = [r, g, b].map((c) => {
-    const sRGB = c / 255;
-    return sRGB <= 0.03928 ? sRGB / 12.92 : Math.pow((sRGB + 0.055) / 1.055, 2.4);
-  });
-  return 0.2126 * rs + 0.7152 * gs + 0.0722 * bs;
-}
-
-/**
- * Calculate contrast ratio between two colors
- * Returns ratio from 1 to 21
- */
-export function getContrastRatio(
-  fg: { r: number; g: number; b: number },
-  bg: { r: number; g: number; b: number }
-): number {
-  const l1 = getRelativeLuminance(fg.r, fg.g, fg.b);
-  const l2 = getRelativeLuminance(bg.r, bg.g, bg.b);
-  const lighter = Math.max(l1, l2);
-  const darker = Math.min(l1, l2);
-  return (lighter + 0.05) / (darker + 0.05);
-}
-
 /**
  * Parse hex color to RGB
  */
@@ -38,20 +11,3 @@ export function hexToRgb(hex: string): { r: number; g: number; b: number } | nul
       }
     : null;
 }
-
-/**
- * Check if a contrast ratio meets WCAG standards
- */
-export function checkWCAGCompliance(ratio: number) {
-  return {
-    aa: {
-      normalText: ratio >= 4.5,
-      largeText: ratio >= 3,
-      ui: ratio >= 3,
-    },
-    aaa: {
-      normalText: ratio >= 7,
-      largeText: ratio >= 4.5,
-    },
-  };
-}

lib/pastel/utils/export.ts

@@ -4,7 +4,7 @@
 
 export interface ExportColor {
   name?: string;
-  hex: string;
+  value: string;
 }
 
 /**
@@ -14,7 +14,7 @@ export function exportAsCSS(colors: ExportColor[]): string {
   const variables = colors
     .map((color, index) => {
       const name = color.name || `color-${index + 1}`;
-      return `  --${name}: ${color.hex};`;
+      return `  --${name}: ${color.value};`;
     })
     .join('\n');
 
@@ -28,7 +28,7 @@ export function exportAsSCSS(colors: ExportColor[]): string {
   return colors
     .map((color, index) => {
       const name = color.name || `color-${index + 1}`;
-      return `$${name}: ${color.hex};`;
+      return `$${name}: ${color.value};`;
     })
     .join('\n');
 }
@@ -40,7 +40,7 @@ export function exportAsTailwind(colors: ExportColor[]): string {
   const colorEntries = colors
     .map((color, index) => {
       const name = color.name || `color-${index + 1}`;
-      return `        '${name}': '${color.hex}',`;
+      return `        '${name}': '${color.value}',`;
     })
     .join('\n');
 
@@ -53,7 +53,7 @@ export function exportAsTailwind(colors: ExportColor[]): string {
 export function exportAsJSON(colors: ExportColor[]): string {
   const colorObjects = colors.map((color, index) => ({
     name: color.name || `color-${index + 1}`,
-    hex: color.hex,
+    value: color.value,
   }));
 
   return JSON.stringify({ colors: colorObjects }, null, 2);
@@ -63,7 +63,7 @@ export function exportAsJSON(colors: ExportColor[]): string {
  * Export colors as JavaScript array
  */
 export function exportAsJavaScript(colors: ExportColor[]): string {
-  const colorArray = colors.map((c) => `'${c.hex}'`).join(', ');
+  const colorArray = colors.map((c) => `'${c.value}'`).join(', ');
   return `const colors = [${colorArray}];`;
 }