imhcode 1.0.0

package/skills/ui-ux-pro-max/cli/src/utils/extract.ts

@@ -0,0 +1,149 @@
+import { mkdir, rm, access, cp, mkdtemp, readdir } from 'node:fs/promises';
+import { join, basename } from 'node:path';
+import { exec } from 'node:child_process';
+import { promisify } from 'node:util';
+import { tmpdir } from 'node:os';
+import type { AIType } from '../types/index.js';
+import { AI_FOLDERS } from '../types/index.js';
+
+const execAsync = promisify(exec);
+
+const EXCLUDED_FILES = ['settings.local.json'];
+
+export async function extractZip(zipPath: string, destDir: string): Promise<void> {
+  try {
+    const isWindows = process.platform === 'win32';
+    if (isWindows) {
+      await execAsync(`powershell -Command "Expand-Archive -Path '${zipPath}' -DestinationPath '${destDir}' -Force"`);
+    } else {
+      await execAsync(`unzip -o "${zipPath}" -d "${destDir}"`);
+    }
+  } catch (error) {
+    throw new Error(`Failed to extract zip: ${error}`);
+  }
+}
+
+async function exists(path: string): Promise<boolean> {
+  try {
+    await access(path);
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+export async function copyFolders(
+  sourceDir: string,
+  targetDir: string,
+  aiType: AIType
+): Promise<string[]> {
+  const copiedFolders: string[] = [];
+
+  const foldersToCopy = aiType === 'all'
+    ? Object.values(AI_FOLDERS).flat()
+    : AI_FOLDERS[aiType];
+
+  // Deduplicate folders (e.g., .shared might be listed multiple times)
+  const uniqueFolders = [...new Set(foldersToCopy)];
+
+  for (const folder of uniqueFolders) {
+    const sourcePath = join(sourceDir, folder);
+    const targetPath = join(targetDir, folder);
+
+    // Check if source folder exists
+    const sourceExists = await exists(sourcePath);
+    if (!sourceExists) {
+      continue;
+    }
+
+    // Create target directory if needed
+    await mkdir(targetPath, { recursive: true });
+
+    // Filter function to exclude certain files
+    const filterFn = (src: string): boolean => {
+      const fileName = basename(src);
+      return !EXCLUDED_FILES.includes(fileName);
+    };
+
+    // Copy recursively
+    try {
+      await cp(sourcePath, targetPath, { recursive: true, filter: filterFn });
+      copiedFolders.push(folder);
+    } catch {
+      // Try shell fallback for older Node versions
+      try {
+        if (process.platform === 'win32') {
+          await execAsync(`xcopy "${sourcePath}" "${targetPath}" /E /I /Y`);
+        } else {
+          await execAsync(`cp -r "${sourcePath}/." "${targetPath}"`);
+        }
+        copiedFolders.push(folder);
+      } catch {
+        // Skip if copy fails
+      }
+    }
+  }
+
+  return copiedFolders;
+}
+
+export async function cleanup(tempDir: string): Promise<void> {
+  try {
+    await rm(tempDir, { recursive: true, force: true });
+  } catch {
+    // Ignore cleanup errors
+  }
+}
+
+/**
+ * Create a temporary directory for extracting ZIP files
+ */
+export async function createTempDir(): Promise<string> {
+  return mkdtemp(join(tmpdir(), 'uipro-'));
+}
+
+/**
+ * Find the extracted folder inside temp directory
+ * GitHub release ZIPs often contain a single root folder
+ */
+async function findExtractedRoot(tempDir: string): Promise<string> {
+  const entries = await readdir(tempDir, { withFileTypes: true });
+  const dirs = entries.filter(e => e.isDirectory());
+
+  // If there's exactly one directory, it's likely the extracted root
+  if (dirs.length === 1) {
+    return join(tempDir, dirs[0].name);
+  }
+
+  // Otherwise, assume tempDir itself is the root
+  return tempDir;
+}
+
+/**
+ * Install from a downloaded and extracted ZIP file
+ */
+export async function installFromZip(
+  zipPath: string,
+  targetDir: string,
+  aiType: AIType
+): Promise<{ copiedFolders: string[]; tempDir: string }> {
+  // Create temp directory
+  const tempDir = await createTempDir();
+
+  try {
+    // Extract ZIP to temp directory
+    await extractZip(zipPath, tempDir);
+
+    // Find the actual root of the extracted content
+    const extractedRoot = await findExtractedRoot(tempDir);
+
+    // Copy folders from extracted content to target
+    const copiedFolders = await copyFolders(extractedRoot, targetDir, aiType);
+
+    return { copiedFolders, tempDir };
+  } catch (error) {
+    // Cleanup on error
+    await cleanup(tempDir);
+    throw error;
+  }
+}

package/skills/ui-ux-pro-max/cli/src/utils/github.ts

@@ -0,0 +1,104 @@
+import { writeFile } from 'node:fs/promises';
+import type { Release } from '../types/index.js';
+
+const REPO_OWNER = 'nextlevelbuilder';
+const REPO_NAME = 'ui-ux-pro-max-skill';
+const API_BASE = 'https://api.github.com';
+
+export class GitHubRateLimitError extends Error {
+  constructor(message: string) {
+    super(message);
+    this.name = 'GitHubRateLimitError';
+  }
+}
+
+export class GitHubDownloadError extends Error {
+  constructor(message: string) {
+    super(message);
+    this.name = 'GitHubDownloadError';
+  }
+}
+
+function checkRateLimit(response: Response): void {
+  const remaining = response.headers.get('x-ratelimit-remaining');
+  if (response.status === 403 && remaining === '0') {
+    const resetTime = response.headers.get('x-ratelimit-reset');
+    const resetDate = resetTime ? new Date(parseInt(resetTime) * 1000).toLocaleTimeString() : 'unknown';
+    throw new GitHubRateLimitError(`GitHub API rate limit exceeded. Resets at ${resetDate}`);
+  }
+  if (response.status === 429) {
+    throw new GitHubRateLimitError('GitHub API rate limit exceeded (429 Too Many Requests)');
+  }
+}
+
+export async function fetchReleases(): Promise<Release[]> {
+  const url = `${API_BASE}/repos/${REPO_OWNER}/${REPO_NAME}/releases`;
+
+  const response = await fetch(url, {
+    headers: {
+      'Accept': 'application/vnd.github.v3+json',
+      'User-Agent': 'uipro-cli',
+    },
+  });
+
+  checkRateLimit(response);
+
+  if (!response.ok) {
+    throw new GitHubDownloadError(`Failed to fetch releases: ${response.status} ${response.statusText}`);
+  }
+
+  return response.json();
+}
+
+export async function getLatestRelease(): Promise<Release> {
+  const url = `${API_BASE}/repos/${REPO_OWNER}/${REPO_NAME}/releases/latest`;
+
+  const response = await fetch(url, {
+    headers: {
+      'Accept': 'application/vnd.github.v3+json',
+      'User-Agent': 'uipro-cli',
+    },
+  });
+
+  checkRateLimit(response);
+
+  if (!response.ok) {
+    throw new GitHubDownloadError(`Failed to fetch latest release: ${response.status} ${response.statusText}`);
+  }
+
+  return response.json();
+}
+
+export async function downloadRelease(url: string, dest: string): Promise<void> {
+  const response = await fetch(url, {
+    headers: {
+      'User-Agent': 'uipro-cli',
+      'Accept': 'application/octet-stream',
+    },
+  });
+
+  checkRateLimit(response);
+
+  if (!response.ok) {
+    throw new GitHubDownloadError(`Failed to download: ${response.status} ${response.statusText}`);
+  }
+
+  const buffer = await response.arrayBuffer();
+  await writeFile(dest, Buffer.from(buffer));
+}
+
+export function getAssetUrl(release: Release): string | null {
+  // First try to find an uploaded ZIP asset
+  const asset = release.assets.find(a => a.name.endsWith('.zip'));
+  if (asset?.browser_download_url) {
+    return asset.browser_download_url;
+  }
+
+  // Fall back to GitHub's auto-generated archive
+  // Format: https://github.com/{owner}/{repo}/archive/refs/tags/{tag}.zip
+  if (release.tag_name) {
+    return `https://github.com/${REPO_OWNER}/${REPO_NAME}/archive/refs/tags/${release.tag_name}.zip`;
+  }
+
+  return null;
+}

package/skills/ui-ux-pro-max/cli/src/utils/logger.ts

@@ -0,0 +1,11 @@
+import chalk from 'chalk';
+
+export const logger = {
+  info: (msg: string) => console.log(chalk.blue('info'), msg),
+  success: (msg: string) => console.log(chalk.green('success'), msg),
+  warn: (msg: string) => console.log(chalk.yellow('warn'), msg),
+  error: (msg: string) => console.log(chalk.red('error'), msg),
+
+  title: (msg: string) => console.log(chalk.bold.cyan(`\n${msg}\n`)),
+  dim: (msg: string) => console.log(chalk.dim(msg)),
+};

package/skills/ui-ux-pro-max/cli/src/utils/template.ts

@@ -0,0 +1,243 @@
+import { readFile, mkdir, writeFile, cp, access, readdir } from 'node:fs/promises';
+import { join, dirname } from 'node:path';
+import { homedir } from 'node:os';
+import { fileURLToPath } from 'node:url';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+// After bun build: dist/index.js -> ../assets = cli/assets ✓
+const ASSETS_DIR = join(__dirname, '..', 'assets');
+
+export interface PlatformConfig {
+  platform: string;
+  displayName: string;
+  installType: 'full' | 'reference';
+  folderStructure: {
+    root: string;
+    skillPath: string;
+    filename: string;
+  };
+  scriptPath: string;
+  frontmatter: Record<string, string> | null;
+  sections: {
+    quickReference: boolean;
+  };
+  title: string;
+  description: string;
+  skillOrWorkflow: string;
+}
+
+// Map AIType to platform config file name
+const AI_TO_PLATFORM: Record<string, string> = {
+  claude: 'claude',
+  cursor: 'cursor',
+  windsurf: 'windsurf',
+  antigravity: 'agent',
+  copilot: 'copilot',
+  kiro: 'kiro',
+  opencode: 'opencode',
+  roocode: 'roocode',
+  codex: 'codex',
+  qoder: 'qoder',
+  gemini: 'gemini',
+  trae: 'trae',
+  continue: 'continue',
+  codebuddy: 'codebuddy',
+  droid: 'droid',
+  kilocode: 'kilocode',
+  warp: 'warp',
+  augment: 'augment',
+};
+
+async function exists(path: string): Promise<boolean> {
+  try {
+    await access(path);
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+/**
+ * Load platform configuration from JSON file
+ */
+export async function loadPlatformConfig(aiType: string): Promise<PlatformConfig> {
+  const platformName = AI_TO_PLATFORM[aiType];
+  if (!platformName) {
+    throw new Error(`Unknown AI type: ${aiType}`);
+  }
+
+  const configPath = join(ASSETS_DIR, 'templates', 'platforms', `${platformName}.json`);
+  const content = await readFile(configPath, 'utf-8');
+  return JSON.parse(content) as PlatformConfig;
+}
+
+/**
+ * Load all available platform configs
+ */
+export async function loadAllPlatformConfigs(): Promise<Map<string, PlatformConfig>> {
+  const configs = new Map<string, PlatformConfig>();
+
+  for (const [aiType, platformName] of Object.entries(AI_TO_PLATFORM)) {
+    try {
+      const config = await loadPlatformConfig(aiType);
+      configs.set(aiType, config);
+    } catch {
+      // Skip if config doesn't exist
+    }
+  }
+
+  return configs;
+}
+
+/**
+ * Load a template file
+ */
+async function loadTemplate(templateName: string): Promise<string> {
+  const templatePath = join(ASSETS_DIR, 'templates', templateName);
+  return readFile(templatePath, 'utf-8');
+}
+
+/**
+ * Render frontmatter section
+ */
+function renderFrontmatter(frontmatter: Record<string, string> | null): string {
+  if (!frontmatter) return '';
+
+  const lines = ['---'];
+  for (const [key, value] of Object.entries(frontmatter)) {
+    // Quote values that contain special characters
+    if (value.includes(':') || value.includes('"') || value.includes('\n')) {
+      lines.push(`${key}: "${value.replace(/"/g, '\\"')}"`);
+    } else {
+      lines.push(`${key}: ${value}`);
+    }
+  }
+  lines.push('---', '');
+  return lines.join('\n');
+}
+
+/**
+ * Render skill file content from template
+ * When isGlobal=true, rewrites script paths to use ~/{root}/ prefix
+ */
+export async function renderSkillFile(config: PlatformConfig, isGlobal = false): Promise<string> {
+  // Load base template
+  let content = await loadTemplate('base/skill-content.md');
+
+  // Load quick reference if needed
+  let quickReferenceContent = '';
+  if (config.sections.quickReference) {
+    quickReferenceContent = await loadTemplate('base/quick-reference.md');
+  }
+
+  // Build the final content
+  const frontmatter = renderFrontmatter(config.frontmatter);
+
+  // Replace placeholders
+  // Add newline before quick reference content if it exists
+  const quickRefWithNewline = quickReferenceContent ? '\n' + quickReferenceContent : '';
+
+  content = content
+    .replace(/\{\{TITLE\}\}/g, config.title)
+    .replace(/\{\{DESCRIPTION\}\}/g, config.description)
+    .replace(/\{\{SCRIPT_PATH\}\}/g, config.scriptPath)
+    .replace(/\{\{SKILL_OR_WORKFLOW\}\}/g, config.skillOrWorkflow)
+    .replace(/\{\{QUICK_REFERENCE\}\}/g, quickRefWithNewline);
+
+  // For global install, rewrite relative script paths to absolute ~/root/ paths
+  if (isGlobal) {
+    const globalPrefix = `~/${config.folderStructure.root}/`;
+    content = content.replace(
+      /python3 skills\//g,
+      `python3 ${globalPrefix}skills/`
+    );
+  }
+
+  return frontmatter + content;
+}
+
+/**
+ * Copy data and scripts to target directory
+ */
+async function copyDataAndScripts(targetSkillDir: string): Promise<void> {
+  const dataSource = join(ASSETS_DIR, 'data');
+  const scriptsSource = join(ASSETS_DIR, 'scripts');
+
+  const dataTarget = join(targetSkillDir, 'data');
+  const scriptsTarget = join(targetSkillDir, 'scripts');
+
+  // Copy data
+  if (await exists(dataSource)) {
+    await mkdir(dataTarget, { recursive: true });
+    await cp(dataSource, dataTarget, { recursive: true });
+  }
+
+  // Copy scripts
+  if (await exists(scriptsSource)) {
+    await mkdir(scriptsTarget, { recursive: true });
+    await cp(scriptsSource, scriptsTarget, { recursive: true });
+  }
+}
+
+/**
+ * Generate platform files for a specific AI type
+ * All platforms use self-contained installation with data and scripts
+ * When isGlobal=true, installs to ~/home directory with absolute script paths
+ */
+export async function generatePlatformFiles(
+  targetDir: string,
+  aiType: string,
+  isGlobal = false
+): Promise<string[]> {
+  const config = await loadPlatformConfig(aiType);
+  const createdFolders: string[] = [];
+
+  // For global install, target the user's home directory
+  const effectiveDir = isGlobal ? homedir() : targetDir;
+
+  // Determine full skill directory path
+  const skillDir = join(
+    effectiveDir,
+    config.folderStructure.root,
+    config.folderStructure.skillPath
+  );
+
+  // Create directory structure
+  await mkdir(skillDir, { recursive: true });
+
+  // Render and write skill file (pass isGlobal to adjust paths)
+  const skillContent = await renderSkillFile(config, isGlobal);
+  const skillFilePath = join(skillDir, config.folderStructure.filename);
+  await writeFile(skillFilePath, skillContent, 'utf-8');
+  createdFolders.push(config.folderStructure.root);
+
+  // Copy data and scripts into the skill directory (self-contained)
+  await copyDataAndScripts(skillDir);
+
+  return createdFolders;
+}
+
+/**
+ * Generate files for all AI types
+ */
+export async function generateAllPlatformFiles(targetDir: string, isGlobal = false): Promise<string[]> {
+  const allFolders = new Set<string>();
+
+  for (const aiType of Object.keys(AI_TO_PLATFORM)) {
+    try {
+      const folders = await generatePlatformFiles(targetDir, aiType, isGlobal);
+      folders.forEach(f => allFolders.add(f));
+    } catch {
+      // Skip if generation fails for a platform
+    }
+  }
+
+  return Array.from(allFolders);
+}
+
+/**
+ * Get list of supported AI types
+ */
+export function getSupportedAITypes(): string[] {
+  return Object.keys(AI_TO_PLATFORM);
+}

package/skills/ui-ux-pro-max/cli/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "esModuleInterop": true,
+    "strict": true,
+    "skipLibCheck": true,
+    "outDir": "dist",
+    "rootDir": "src",
+    "declaration": true,
+    "resolveJsonModule": true,
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "dist"]
+}

package/skills/ui-ux-pro-max/data/charts.csv

@@ -0,0 +1,26 @@
+No,Data Type,Keywords,Best Chart Type,Secondary Options,Color Guidance,Performance Impact,Accessibility Notes,Library Recommendation,Interactive Level
+1,Trend Over Time,"trend, time-series, line, growth, timeline, progress",Line Chart,"Area Chart, Smooth Area",Primary: #0080FF. Multiple series: use distinct colors. Fill: 20% opacity,⚡ Excellent (optimized),✓ Clear line patterns for colorblind users. Add pattern overlays.,"Chart.js, Recharts, ApexCharts",Hover + Zoom
+2,Compare Categories,"compare, categories, bar, comparison, ranking",Bar Chart (Horizontal or Vertical),"Column Chart, Grouped Bar",Each bar: distinct color. Category: grouped same color. Sorted: descending order,⚡ Excellent,✓ Easy to compare. Add value labels on bars for clarity.,"Chart.js, Recharts, D3.js",Hover + Sort
+3,Part-to-Whole,"part-to-whole, pie, donut, percentage, proportion, share",Pie Chart or Donut,"Stacked Bar, Treemap",Colors: 5-6 max. Contrasting palette. Large slices first. Use labels.,⚡ Good (limit 6 slices),⚠ Hard for accessibility. Better: Stacked bar with legend. Avoid pie if >5 items.,"Chart.js, Recharts, D3.js",Hover + Drill
+4,Correlation/Distribution,"correlation, distribution, scatter, relationship, pattern",Scatter Plot or Bubble Chart,"Heat Map, Matrix",Color axis: gradient (blue-red). Size: relative. Opacity: 0.6-0.8 to show density,⚠ Moderate (many points),⚠ Provide data table alternative. Use pattern + color distinction.,"D3.js, Plotly, Recharts",Hover + Brush
+5,Heatmap/Intensity,"heatmap, heat-map, intensity, density, matrix",Heat Map or Choropleth,"Grid Heat Map, Bubble Heat",Gradient: Cool (blue) to Hot (red). Scale: clear legend. Divergent for ±data,⚡ Excellent (color CSS),⚠ Colorblind: Use pattern overlay. Provide numerical legend.,"D3.js, Plotly, ApexCharts",Hover + Zoom
+6,Geographic Data,"geographic, map, location, region, geo, spatial","Choropleth Map, Bubble Map",Geographic Heat Map,Regional: single color gradient or categorized colors. Legend: clear scale,⚠ Moderate (rendering),⚠ Include text labels for regions. Provide data table alternative.,"D3.js, Mapbox, Leaflet",Pan + Zoom + Drill
+7,Funnel/Flow,funnel/flow,"Funnel Chart, Sankey",Waterfall (for flows),Stages: gradient (starting color → ending color). Show conversion %,⚡ Good,✓ Clear stage labels + percentages. Good for accessibility if labeled.,"D3.js, Recharts, Custom SVG",Hover + Drill
+8,Performance vs Target,performance-vs-target,Gauge Chart or Bullet Chart,"Dial, Thermometer",Performance: Red→Yellow→Green gradient. Target: marker line. Threshold colors,⚡ Good,✓ Add numerical value + percentage label beside gauge.,"D3.js, ApexCharts, Custom SVG",Hover
+9,Time-Series Forecast,time-series-forecast,Line with Confidence Band,Ribbon Chart,Actual: solid line #0080FF. Forecast: dashed #FF9500. Band: light shading,⚡ Good,✓ Clearly distinguish actual vs forecast. Add legend.,"Chart.js, ApexCharts, Plotly",Hover + Toggle
+10,Anomaly Detection,anomaly-detection,Line Chart with Highlights,Scatter with Alert,Normal: blue #0080FF. Anomaly: red #FF0000 circle/square marker + alert,⚡ Good,✓ Circle/marker for anomalies. Add text alert annotation.,"D3.js, Plotly, ApexCharts",Hover + Alert
+11,Hierarchical/Nested Data,hierarchical/nested-data,Treemap,"Sunburst, Nested Donut, Icicle",Parent: distinct hues. Children: lighter shades. White borders 2-3px.,⚠ Moderate,⚠ Poor - provide table alternative. Label large areas.,"D3.js, Recharts, ApexCharts",Hover + Drilldown
+12,Flow/Process Data,flow/process-data,Sankey Diagram,"Alluvial, Chord Diagram",Gradient from source to target. Opacity 0.4-0.6 for flows.,⚠ Moderate,⚠ Poor - provide flow table alternative.,"D3.js (d3-sankey), Plotly",Hover + Drilldown
+13,Cumulative Changes,cumulative-changes,Waterfall Chart,"Stacked Bar, Cascade",Increases: #4CAF50. Decreases: #F44336. Start: #2196F3. End: #0D47A1.,⚡ Good,✓ Good - clear directional colors with labels.,"ApexCharts, Highcharts, Plotly",Hover
+14,Multi-Variable Comparison,multi-variable-comparison,Radar/Spider Chart,"Parallel Coordinates, Grouped Bar",Single: #0080FF 20% fill. Multiple: distinct colors per dataset.,⚡ Good,⚠ Moderate - limit 5-8 axes. Add data table.,"Chart.js, Recharts, ApexCharts",Hover + Toggle
+15,Stock/Trading OHLC,stock/trading-ohlc,Candlestick Chart,"OHLC Bar, Heikin-Ashi",Bullish: #26A69A. Bearish: #EF5350. Volume: 40% opacity below.,⚡ Good,⚠ Moderate - provide OHLC data table.,"Lightweight Charts (TradingView), ApexCharts",Real-time + Hover + Zoom
+16,Relationship/Connection Data,relationship/connection-data,Network Graph,"Hierarchical Tree, Adjacency Matrix",Node types: categorical colors. Edges: #90A4AE 60% opacity.,❌ Poor (500+ nodes struggles),❌ Very Poor - provide adjacency list alternative.,"D3.js (d3-force), Vis.js, Cytoscape.js",Drilldown + Hover + Drag
+17,Distribution/Statistical,distribution/statistical,Box Plot,"Violin Plot, Beeswarm",Box: #BBDEFB. Border: #1976D2. Median: #D32F2F. Outliers: #F44336.,⚡ Excellent,"✓ Good - include stats table (min, Q1, median, Q3, max).","Plotly, D3.js, Chart.js (plugin)",Hover
+18,Performance vs Target (Compact),performance-vs-target-(compact),Bullet Chart,"Gauge, Progress Bar","Ranges: #FFCDD2, #FFF9C4, #C8E6C9. Performance: #1976D2. Target: black 3px.",⚡ Excellent,✓ Excellent - compact with clear values.,"D3.js, Plotly, Custom SVG",Hover
+19,Proportional/Percentage,proportional/percentage,Waffle Chart,"Pictogram, Stacked Bar 100%",10x10 grid. 3-5 categories max. 2-3px spacing between squares.,⚡ Good,✓ Good - better than pie for accessibility.,"D3.js, React-Waffle, Custom CSS Grid",Hover
+20,Hierarchical Proportional,hierarchical-proportional,Sunburst Chart,"Treemap, Icicle, Circle Packing",Center to outer: darker to lighter. 15-20% lighter per level.,⚠ Moderate,⚠ Poor - provide hierarchy table alternative.,"D3.js (d3-hierarchy), Recharts, ApexCharts",Drilldown + Hover
+21,Root Cause Analysis,"root cause, decomposition, tree, hierarchy, drill-down, ai-split",Decomposition Tree,"Decision Tree, Flow Chart",Nodes: #2563EB (Primary) vs #EF4444 (Negative impact). Connectors: Neutral grey.,⚠ Moderate (calculation heavy),✓ clear hierarchy. Allow keyboard navigation for nodes.,"Power BI (native), React-Flow, Custom D3.js",Drill + Expand
+22,3D Spatial Data,"3d, spatial, immersive, terrain, molecular, volumetric",3D Scatter/Surface Plot,"Volumetric Rendering, Point Cloud",Depth cues: lighting/shading. Z-axis: color gradient (cool to warm).,❌ Heavy (WebGL required),❌ Poor - requires alternative 2D view or data table.,"Three.js, Deck.gl, Plotly 3D",Rotate + Zoom + VR
+23,Real-Time Streaming,"streaming, real-time, ticker, live, velocity, pulse",Streaming Area Chart,"Ticker Tape, Moving Gauge",Current: Bright Pulse (#00FF00). History: Fading opacity. Grid: Dark.,⚡ Optimized (canvas/webgl),⚠ Flashing elements - provide pause button. High contrast.,Smoothed D3.js, CanvasJS
+24,Sentiment/Emotion,"sentiment, emotion, nlp, opinion, feeling",Word Cloud with Sentiment,"Sentiment Arc, Radar Chart",Positive: #22C55E. Negative: #EF4444. Neutral: #94A3B8. Size = Frequency.,⚡ Good,⚠ Word clouds poor for screen readers. Use list view.,"D3-cloud, Highcharts, Nivo",Hover + Filter
+25,Process Mining,"process, mining, variants, path, bottleneck, log",Process Map / Graph,"Directed Acyclic Graph (DAG), Petri Net",Happy path: #10B981 (Thick). Deviations: #F59E0B (Thin). Bottlenecks: #EF4444.,⚠ Moderate to Heavy,⚠ Complex graphs hard to navigate. Provide path summary.,"React-Flow, Cytoscape.js, Recharts",Drag + Node-Click

package/skills/ui-ux-pro-max/data/colors.csv

@@ -0,0 +1,97 @@
+No,Product Type,Primary (Hex),Secondary (Hex),CTA (Hex),Background (Hex),Text (Hex),Border (Hex),Notes
+1,SaaS (General),#2563EB,#3B82F6,#F97316,#F8FAFC,#1E293B,#E2E8F0,Trust blue + orange CTA contrast
+2,Micro SaaS,#6366F1,#818CF8,#10B981,#F5F3FF,#1E1B4B,#E0E7FF,Indigo primary + emerald CTA
+3,E-commerce,#059669,#10B981,#F97316,#ECFDF5,#064E3B,#A7F3D0,Success green + urgency orange
+4,E-commerce Luxury,#1C1917,#44403C,#CA8A04,#FAFAF9,#0C0A09,#D6D3D1,Premium dark + gold accent
+5,Service Landing Page,#0EA5E9,#38BDF8,#F97316,#F0F9FF,#0C4A6E,#BAE6FD,Sky blue trust + warm CTA
+6,B2B Service,#0F172A,#334155,#0369A1,#F8FAFC,#020617,#E2E8F0,Professional navy + blue CTA
+7,Financial Dashboard,#0F172A,#1E293B,#22C55E,#020617,#F8FAFC,#334155,Dark bg + green positive indicators
+8,Analytics Dashboard,#1E40AF,#3B82F6,#F59E0B,#F8FAFC,#1E3A8A,#DBEAFE,Blue data + amber highlights
+9,Healthcare App,#0891B2,#22D3EE,#059669,#ECFEFF,#164E63,#A5F3FC,Calm cyan + health green
+10,Educational App,#4F46E5,#818CF8,#F97316,#EEF2FF,#1E1B4B,#C7D2FE,Playful indigo + energetic orange
+11,Creative Agency,#EC4899,#F472B6,#06B6D4,#FDF2F8,#831843,#FBCFE8,Bold pink + cyan accent
+12,Portfolio/Personal,#18181B,#3F3F46,#2563EB,#FAFAFA,#09090B,#E4E4E7,Monochrome + blue accent
+13,Gaming,#7C3AED,#A78BFA,#F43F5E,#0F0F23,#E2E8F0,#4C1D95,Neon purple + rose action
+14,Government/Public Service,#0F172A,#334155,#0369A1,#F8FAFC,#020617,#E2E8F0,High contrast navy + blue
+15,Fintech/Crypto,#F59E0B,#FBBF24,#8B5CF6,#0F172A,#F8FAFC,#334155,Gold trust + purple tech
+16,Social Media App,#E11D48,#FB7185,#2563EB,#FFF1F2,#881337,#FECDD3,Vibrant rose + engagement blue
+17,Productivity Tool,#0D9488,#14B8A6,#F97316,#F0FDFA,#134E4A,#99F6E4,Teal focus + action orange
+18,Design System/Component Library,#4F46E5,#6366F1,#F97316,#EEF2FF,#312E81,#C7D2FE,Indigo brand + doc hierarchy
+19,AI/Chatbot Platform,#7C3AED,#A78BFA,#06B6D4,#FAF5FF,#1E1B4B,#DDD6FE,AI purple + cyan interactions
+20,NFT/Web3 Platform,#8B5CF6,#A78BFA,#FBBF24,#0F0F23,#F8FAFC,#4C1D95,Purple tech + gold value
+21,Creator Economy Platform,#EC4899,#F472B6,#F97316,#FDF2F8,#831843,#FBCFE8,Creator pink + engagement orange
+22,Sustainability/ESG Platform,#059669,#10B981,#0891B2,#ECFDF5,#064E3B,#A7F3D0,Nature green + ocean blue
+23,Remote Work/Collaboration Tool,#6366F1,#818CF8,#10B981,#F5F3FF,#312E81,#E0E7FF,Calm indigo + success green
+24,Mental Health App,#8B5CF6,#C4B5FD,#10B981,#FAF5FF,#4C1D95,#EDE9FE,Calming lavender + wellness green
+25,Pet Tech App,#F97316,#FB923C,#2563EB,#FFF7ED,#9A3412,#FED7AA,Playful orange + trust blue
+26,Smart Home/IoT Dashboard,#1E293B,#334155,#22C55E,#0F172A,#F8FAFC,#475569,Dark tech + status green
+27,EV/Charging Ecosystem,#0891B2,#22D3EE,#22C55E,#ECFEFF,#164E63,#A5F3FC,Electric cyan + eco green
+28,Subscription Box Service,#D946EF,#E879F9,#F97316,#FDF4FF,#86198F,#F5D0FE,Excitement purple + urgency orange
+29,Podcast Platform,#1E1B4B,#312E81,#F97316,#0F0F23,#F8FAFC,#4338CA,Dark audio + warm accent
+30,Dating App,#E11D48,#FB7185,#F97316,#FFF1F2,#881337,#FECDD3,Romantic rose + warm orange
+31,Micro-Credentials/Badges Platform,#0369A1,#0EA5E9,#CA8A04,#F0F9FF,#0C4A6E,#BAE6FD,Trust blue + achievement gold
+32,Knowledge Base/Documentation,#475569,#64748B,#2563EB,#F8FAFC,#1E293B,#E2E8F0,Neutral grey + link blue
+33,Hyperlocal Services,#059669,#10B981,#F97316,#ECFDF5,#064E3B,#A7F3D0,Location green + action orange
+34,Beauty/Spa/Wellness Service,#EC4899,#F9A8D4,#8B5CF6,#FDF2F8,#831843,#FBCFE8,Soft pink + lavender luxury
+35,Luxury/Premium Brand,#1C1917,#44403C,#CA8A04,#FAFAF9,#0C0A09,#D6D3D1,Premium black + gold accent
+36,Restaurant/Food Service,#DC2626,#F87171,#CA8A04,#FEF2F2,#450A0A,#FECACA,Appetizing red + warm gold
+37,Fitness/Gym App,#F97316,#FB923C,#22C55E,#1F2937,#F8FAFC,#374151,Energy orange + success green
+38,Real Estate/Property,#0F766E,#14B8A6,#0369A1,#F0FDFA,#134E4A,#99F6E4,Trust teal + professional blue
+39,Travel/Tourism Agency,#0EA5E9,#38BDF8,#F97316,#F0F9FF,#0C4A6E,#BAE6FD,Sky blue + adventure orange
+40,Hotel/Hospitality,#1E3A8A,#3B82F6,#CA8A04,#F8FAFC,#1E40AF,#BFDBFE,Luxury navy + gold service
+41,Wedding/Event Planning,#DB2777,#F472B6,#CA8A04,#FDF2F8,#831843,#FBCFE8,Romantic pink + elegant gold
+42,Legal Services,#1E3A8A,#1E40AF,#B45309,#F8FAFC,#0F172A,#CBD5E1,Authority navy + trust gold
+43,Insurance Platform,#0369A1,#0EA5E9,#22C55E,#F0F9FF,#0C4A6E,#BAE6FD,Security blue + protected green
+44,Banking/Traditional Finance,#0F172A,#1E3A8A,#CA8A04,#F8FAFC,#020617,#E2E8F0,Trust navy + premium gold
+45,Online Course/E-learning,#0D9488,#2DD4BF,#F97316,#F0FDFA,#134E4A,#5EEAD4,Progress teal + achievement orange
+46,Non-profit/Charity,#0891B2,#22D3EE,#F97316,#ECFEFF,#164E63,#A5F3FC,Compassion blue + action orange
+47,Music Streaming,#1E1B4B,#4338CA,#22C55E,#0F0F23,#F8FAFC,#312E81,Dark audio + play green
+48,Video Streaming/OTT,#0F0F23,#1E1B4B,#E11D48,#000000,#F8FAFC,#312E81,Cinema dark + play red
+49,Job Board/Recruitment,#0369A1,#0EA5E9,#22C55E,#F0F9FF,#0C4A6E,#BAE6FD,Professional blue + success green
+50,Marketplace (P2P),#7C3AED,#A78BFA,#22C55E,#FAF5FF,#4C1D95,#DDD6FE,Trust purple + transaction green
+51,Logistics/Delivery,#2563EB,#3B82F6,#F97316,#EFF6FF,#1E40AF,#BFDBFE,Tracking blue + delivery orange
+52,Agriculture/Farm Tech,#15803D,#22C55E,#CA8A04,#F0FDF4,#14532D,#BBF7D0,Earth green + harvest gold
+53,Construction/Architecture,#64748B,#94A3B8,#F97316,#F8FAFC,#334155,#E2E8F0,Industrial grey + safety orange
+54,Automotive/Car Dealership,#1E293B,#334155,#DC2626,#F8FAFC,#0F172A,#E2E8F0,Premium dark + action red
+55,Photography Studio,#18181B,#27272A,#F8FAFC,#000000,#FAFAFA,#3F3F46,Pure black + white contrast
+56,Coworking Space,#F59E0B,#FBBF24,#2563EB,#FFFBEB,#78350F,#FDE68A,Energetic amber + booking blue
+57,Cleaning Service,#0891B2,#22D3EE,#22C55E,#ECFEFF,#164E63,#A5F3FC,Fresh cyan + clean green
+58,Home Services (Plumber/Electrician),#1E40AF,#3B82F6,#F97316,#EFF6FF,#1E3A8A,#BFDBFE,Professional blue + urgent orange
+59,Childcare/Daycare,#F472B6,#FBCFE8,#22C55E,#FDF2F8,#9D174D,#FCE7F3,Soft pink + safe green
+60,Senior Care/Elderly,#0369A1,#38BDF8,#22C55E,#F0F9FF,#0C4A6E,#E0F2FE,Calm blue + reassuring green
+61,Medical Clinic,#0891B2,#22D3EE,#22C55E,#F0FDFA,#134E4A,#CCFBF1,Medical teal + health green
+62,Pharmacy/Drug Store,#15803D,#22C55E,#0369A1,#F0FDF4,#14532D,#BBF7D0,Pharmacy green + trust blue
+63,Dental Practice,#0EA5E9,#38BDF8,#FBBF24,#F0F9FF,#0C4A6E,#BAE6FD,Fresh blue + smile yellow
+64,Veterinary Clinic,#0D9488,#14B8A6,#F97316,#F0FDFA,#134E4A,#99F6E4,Caring teal + warm orange
+65,Florist/Plant Shop,#15803D,#22C55E,#EC4899,#F0FDF4,#14532D,#BBF7D0,Natural green + floral pink
+66,Bakery/Cafe,#92400E,#B45309,#F8FAFC,#FEF3C7,#78350F,#FDE68A,Warm brown + cream white
+67,Coffee Shop,#78350F,#92400E,#FBBF24,#FEF3C7,#451A03,#FDE68A,Coffee brown + warm gold
+68,Brewery/Winery,#7C2D12,#B91C1C,#CA8A04,#FEF2F2,#450A0A,#FECACA,Deep burgundy + craft gold
+69,Airline,#1E3A8A,#3B82F6,#F97316,#EFF6FF,#1E40AF,#BFDBFE,Sky blue + booking orange
+70,News/Media Platform,#DC2626,#EF4444,#1E40AF,#FEF2F2,#450A0A,#FECACA,Breaking red + link blue
+71,Magazine/Blog,#18181B,#3F3F46,#EC4899,#FAFAFA,#09090B,#E4E4E7,Editorial black + accent pink
+72,Freelancer Platform,#6366F1,#818CF8,#22C55E,#EEF2FF,#312E81,#C7D2FE,Creative indigo + hire green
+73,Consulting Firm,#0F172A,#334155,#CA8A04,#F8FAFC,#020617,#E2E8F0,Authority navy + premium gold
+74,Marketing Agency,#EC4899,#F472B6,#06B6D4,#FDF2F8,#831843,#FBCFE8,Bold pink + creative cyan
+75,Event Management,#7C3AED,#A78BFA,#F97316,#FAF5FF,#4C1D95,#DDD6FE,Excitement purple + action orange
+76,Conference/Webinar Platform,#1E40AF,#3B82F6,#22C55E,#EFF6FF,#1E3A8A,#BFDBFE,Professional blue + join green
+77,Membership/Community,#7C3AED,#A78BFA,#22C55E,#FAF5FF,#4C1D95,#DDD6FE,Community purple + join green
+78,Newsletter Platform,#0369A1,#0EA5E9,#F97316,#F0F9FF,#0C4A6E,#BAE6FD,Trust blue + subscribe orange
+79,Digital Products/Downloads,#6366F1,#818CF8,#22C55E,#EEF2FF,#312E81,#C7D2FE,Digital indigo + buy green
+80,Church/Religious Organization,#7C3AED,#A78BFA,#CA8A04,#FAF5FF,#4C1D95,#DDD6FE,Spiritual purple + warm gold
+81,Sports Team/Club,#DC2626,#EF4444,#FBBF24,#FEF2F2,#7F1D1D,#FECACA,Team red + championship gold
+82,Museum/Gallery,#18181B,#27272A,#F8FAFC,#FAFAFA,#09090B,#E4E4E7,Gallery black + white space
+83,Theater/Cinema,#1E1B4B,#312E81,#CA8A04,#0F0F23,#F8FAFC,#4338CA,Dramatic dark + spotlight gold
+84,Language Learning App,#4F46E5,#818CF8,#22C55E,#EEF2FF,#312E81,#C7D2FE,Learning indigo + progress green
+85,Coding Bootcamp,#0F172A,#1E293B,#22C55E,#020617,#F8FAFC,#334155,Terminal dark + success green
+86,Cybersecurity Platform,#00FF41,#0D0D0D,#FF3333,#000000,#E0E0E0,#1F1F1F,Matrix green + alert red
+87,Developer Tool / IDE,#1E293B,#334155,#22C55E,#0F172A,#F8FAFC,#475569,Code dark + run green
+88,Biotech / Life Sciences,#0EA5E9,#0284C7,#10B981,#F0F9FF,#0C4A6E,#BAE6FD,DNA blue + life green
+89,Space Tech / Aerospace,#F8FAFC,#94A3B8,#3B82F6,#0B0B10,#F8FAFC,#1E293B,Star white + launch blue
+90,Architecture / Interior,#171717,#404040,#D4AF37,#FFFFFF,#171717,#E5E5E5,Minimal black + accent gold
+91,Quantum Computing,#00FFFF,#7B61FF,#FF00FF,#050510,#E0E0FF,#333344,Quantum cyan + interference purple
+92,Biohacking / Longevity,#FF4D4D,#4D94FF,#00E676,#F5F5F7,#1C1C1E,#E5E5EA,Bio red/blue + vitality green
+93,Autonomous Systems,#00FF41,#008F11,#FF3333,#0D1117,#E6EDF3,#30363D,Terminal green + alert red
+94,Generative AI Art,#18181B,#3F3F46,#EC4899,#FAFAFA,#09090B,#E4E4E7,Canvas neutral + creative pink
+95,Spatial / Vision OS,#FFFFFF,#E5E5E5,#007AFF,#888888,#000000,#CCCCCC,Glass white + system blue
+96,Climate Tech,#059669,#10B981,#FBBF24,#ECFDF5,#064E3B,#A7F3D0,Nature green + solar gold