@polymorphism-tech/morph-spec 8.1.0 → 8.1.1

package/src/lib/detectors/design-system-detector.js

@@ -1,231 +1,231 @@
-/**
- * @fileoverview Design System Detector
- *
- * Detects if a design system exists for the project or feature.
- * Checks multiple locations in priority order.
- *
- * @module design-system-detector
- */
-
-import { existsSync, readFileSync, readdirSync } from 'fs';
-import { join } from 'path';
-
-const SKIP_DIRS = new Set(['node_modules', '.git', '.morph', 'dist', 'build', '.next', 'obj', 'bin', '.vs']);
-const CSS_SCAN_MAX_DEPTH = 6;
-
-/**
- * Recursively walk a directory collecting files with given extensions.
- * @param {string} dir - Directory to walk
- * @param {string[]} extensions - File extensions to collect (e.g. ['.css', '.scss'])
- * @param {string[]} files - Accumulator array (mutated in-place)
- * @param {number} depth - Current recursion depth
- * @param {number} maxDepth - Maximum recursion depth
- */
-function walkDirForCss(dir, extensions, files, depth, maxDepth) {
-  if (depth > maxDepth) return;
-  let entries;
-  try {
-    entries = readdirSync(dir, { withFileTypes: true });
-  } catch {
-    return;
-  }
-  for (const entry of entries) {
-    if (entry.isDirectory()) {
-      if (!SKIP_DIRS.has(entry.name)) {
-        walkDirForCss(join(dir, entry.name), extensions, files, depth + 1, maxDepth);
-      }
-    } else if (entry.isFile()) {
-      const lower = entry.name.toLowerCase();
-      if (extensions.some(ext => lower.endsWith(ext))) {
-        files.push(join(dir, entry.name));
-      }
-    }
-  }
-}
-
-/**
- * Detect design system for project or feature
- * @param {string} projectPath - Root path of the project
- * @param {string|null} featureName - Feature name (optional, checks feature-level if provided)
- * @returns {Object} { hasDesignSystem, path, isProjectLevel, isFeatureLevel, source }
- */
-export function detectDesignSystem(projectPath, featureName = null) {
-  const result = {
-    hasDesignSystem: false,
-    path: null,
-    isProjectLevel: false,
-    isFeatureLevel: false,
-    source: null
-  };
-
-  // Priority 1: Feature-level design system (if feature specified)
-  if (featureName) {
-    const featureDesignSystemPath = join(
-      projectPath,
-      '.morph/features',
-      featureName,
-      '1-design',
-      'design-system.md'
-    );
-
-    if (existsSync(featureDesignSystemPath)) {
-      return {
-        hasDesignSystem: true,
-        path: featureDesignSystemPath,
-        isProjectLevel: false,
-        isFeatureLevel: true,
-        source: 'feature-output'
-      };
-    }
-  }
-
-  // Priority 2: Project-level design system (markdown)
-  const projectDesignSystemPath = join(projectPath, '.morph/context/design-system.md');
-  if (existsSync(projectDesignSystemPath)) {
-    return {
-      hasDesignSystem: true,
-      path: projectDesignSystemPath,
-      isProjectLevel: true,
-      isFeatureLevel: false,
-      source: 'project-markdown'
-    };
-  }
-
-  // Priority 3: Generated CSS design system
-  const cssDesignSystemPath = join(projectPath, 'wwwroot/css/design-system.css');
-  if (existsSync(cssDesignSystemPath)) {
-    return {
-      hasDesignSystem: true,
-      path: cssDesignSystemPath,
-      isProjectLevel: true,
-      isFeatureLevel: false,
-      source: 'generated-css'
-    };
-  }
-
-  // Priority 4: Recursively scan frontend root directories for CSS/SCSS with design tokens
-  const frontendRoots = ['wwwroot', 'styles', 'src/styles', 'src', 'public'];
-  const extensions = ['.css', '.scss'];
-  const collected = [];
-
-  for (const root of frontendRoots) {
-    const rootPath = join(projectPath, root);
-    if (existsSync(rootPath)) {
-      walkDirForCss(rootPath, extensions, collected, 0, CSS_SCAN_MAX_DEPTH);
-    }
-  }
-
-  // Deduplicate by resolved path
-  const seen = new Set();
-  const cssFiles = [];
-  for (const file of collected) {
-    if (!seen.has(file)) {
-      seen.add(file);
-      cssFiles.push(file);
-    }
-  }
-
-  // Sort for deterministic first-match across platforms
-  cssFiles.sort();
-
-  for (const cssFile of cssFiles) {
-    try {
-      const content = readFileSync(cssFile, 'utf8');
-      const hasDesignTokens = /:root\s*\{[\s\S]*?--/.test(content);
-      if (hasDesignTokens) {
-        return {
-          hasDesignSystem: true,
-          path: cssFile,
-          isProjectLevel: true,
-          isFeatureLevel: false,
-          source: 'existing-css-variables'
-        };
-      }
-    } catch {
-      // Continue checking other files
-    }
-  }
-
-  // No design system found
-  return result;
-}
-
-/**
- * Check if UI agents are active for a feature
- * @param {string} projectPath - Root path of the project
- * @param {string} featureName - Feature name
- * @returns {boolean} True if UI agents are active
- */
-export function hasUIAgentsActive(projectPath, featureName) {
-  try {
-    const statePath = join(projectPath, '.morph/state.json');
-
-    if (!existsSync(statePath)) {
-      return false;
-    }
-
-    const state = JSON.parse(readFileSync(statePath, 'utf8'));
-
-    // Handle both array and object format
-    let feature;
-    if (Array.isArray(state.features)) {
-      feature = state.features.find(f => f.name === featureName);
-    } else if (state.features && typeof state.features === 'object') {
-      feature = state.features[featureName];
-    }
-
-    if (!feature || !feature.activeAgents) {
-      return false;
-    }
-
-    // UI design agents that require a design system before implement phase.
-    // Implementation-only agents (nextjs-expert, css-specialist)
-    // build from existing designs and do NOT trigger this gate.
-    const uiAgents = [
-      'ui-designer',
-      'uiux-designer',
-      'ui-ux-designer',
-    ];
-
-    return feature.activeAgents.some(agentId => uiAgents.includes(agentId));
-  } catch {
-    return false;
-  }
-}
-
-/**
- * Get recommended design system locations based on project type
- * @param {string} projectPath - Root path of the project
- * @returns {Object} { markdown, css, description }
- */
-export function getRecommendedLocations(projectPath) {
-  try {
-    const configPath = join(projectPath, '.morph/config/config.json');
-
-    let projectType = 'unknown';
-    if (existsSync(configPath)) {
-      const config = JSON.parse(readFileSync(configPath, 'utf8'));
-      projectType = config.project?.type || 'unknown';
-    }
-
-    // Default locations
-    const locations = {
-      markdown: '.morph/context/design-system.md',
-      css: 'public/design-system.css',
-      description: 'Project-level design system (shared across features)'
-    };
-
-    // Adjust based on project type
-    if (projectType === 'nextjs' || projectType.includes('nextjs')) {
-      locations.css = 'styles/design-system.css';
-    }
-
-    return locations;
-  } catch {
-    return {
-      markdown: '.morph/context/design-system.md',
-      css: 'wwwroot/css/design-system.css',
-      description: 'Project-level design system (shared across features)'
-    };
-  }
-}
+/**
+ * @fileoverview Design System Detector
+ *
+ * Detects if a design system exists for the project or feature.
+ * Checks multiple locations in priority order.
+ *
+ * @module design-system-detector
+ */
+
+import { existsSync, readFileSync, readdirSync } from 'fs';
+import { join } from 'path';
+
+const SKIP_DIRS = new Set(['node_modules', '.git', '.morph', 'dist', 'build', '.next', 'obj', 'bin', '.vs']);
+const CSS_SCAN_MAX_DEPTH = 6;
+
+/**
+ * Recursively walk a directory collecting files with given extensions.
+ * @param {string} dir - Directory to walk
+ * @param {string[]} extensions - File extensions to collect (e.g. ['.css', '.scss'])
+ * @param {string[]} files - Accumulator array (mutated in-place)
+ * @param {number} depth - Current recursion depth
+ * @param {number} maxDepth - Maximum recursion depth
+ */
+function walkDirForCss(dir, extensions, files, depth, maxDepth) {
+  if (depth > maxDepth) return;
+  let entries;
+  try {
+    entries = readdirSync(dir, { withFileTypes: true });
+  } catch {
+    return;
+  }
+  for (const entry of entries) {
+    if (entry.isDirectory()) {
+      if (!SKIP_DIRS.has(entry.name)) {
+        walkDirForCss(join(dir, entry.name), extensions, files, depth + 1, maxDepth);
+      }
+    } else if (entry.isFile()) {
+      const lower = entry.name.toLowerCase();
+      if (extensions.some(ext => lower.endsWith(ext))) {
+        files.push(join(dir, entry.name));
+      }
+    }
+  }
+}
+
+/**
+ * Detect design system for project or feature
+ * @param {string} projectPath - Root path of the project
+ * @param {string|null} featureName - Feature name (optional, checks feature-level if provided)
+ * @returns {Object} { hasDesignSystem, path, isProjectLevel, isFeatureLevel, source }
+ */
+export function detectDesignSystem(projectPath, featureName = null) {
+  const result = {
+    hasDesignSystem: false,
+    path: null,
+    isProjectLevel: false,
+    isFeatureLevel: false,
+    source: null
+  };
+
+  // Priority 1: Feature-level design system (if feature specified)
+  if (featureName) {
+    const featureDesignSystemPath = join(
+      projectPath,
+      '.morph/features',
+      featureName,
+      '1-design',
+      'design-system.md'
+    );
+
+    if (existsSync(featureDesignSystemPath)) {
+      return {
+        hasDesignSystem: true,
+        path: featureDesignSystemPath,
+        isProjectLevel: false,
+        isFeatureLevel: true,
+        source: 'feature-output'
+      };
+    }
+  }
+
+  // Priority 2: Project-level design system (markdown)
+  const projectDesignSystemPath = join(projectPath, '.morph/context/design-system.md');
+  if (existsSync(projectDesignSystemPath)) {
+    return {
+      hasDesignSystem: true,
+      path: projectDesignSystemPath,
+      isProjectLevel: true,
+      isFeatureLevel: false,
+      source: 'project-markdown'
+    };
+  }
+
+  // Priority 3: Generated CSS design system
+  const cssDesignSystemPath = join(projectPath, 'wwwroot/css/design-system.css');
+  if (existsSync(cssDesignSystemPath)) {
+    return {
+      hasDesignSystem: true,
+      path: cssDesignSystemPath,
+      isProjectLevel: true,
+      isFeatureLevel: false,
+      source: 'generated-css'
+    };
+  }
+
+  // Priority 4: Recursively scan frontend root directories for CSS/SCSS with design tokens
+  const frontendRoots = ['wwwroot', 'styles', 'src/styles', 'src', 'public'];
+  const extensions = ['.css', '.scss'];
+  const collected = [];
+
+  for (const root of frontendRoots) {
+    const rootPath = join(projectPath, root);
+    if (existsSync(rootPath)) {
+      walkDirForCss(rootPath, extensions, collected, 0, CSS_SCAN_MAX_DEPTH);
+    }
+  }
+
+  // Deduplicate by resolved path
+  const seen = new Set();
+  const cssFiles = [];
+  for (const file of collected) {
+    if (!seen.has(file)) {
+      seen.add(file);
+      cssFiles.push(file);
+    }
+  }
+
+  // Sort for deterministic first-match across platforms
+  cssFiles.sort();
+
+  for (const cssFile of cssFiles) {
+    try {
+      const content = readFileSync(cssFile, 'utf8');
+      const hasDesignTokens = /:root\s*\{[\s\S]*?--/.test(content);
+      if (hasDesignTokens) {
+        return {
+          hasDesignSystem: true,
+          path: cssFile,
+          isProjectLevel: true,
+          isFeatureLevel: false,
+          source: 'existing-css-variables'
+        };
+      }
+    } catch {
+      // Continue checking other files
+    }
+  }
+
+  // No design system found
+  return result;
+}
+
+/**
+ * Check if UI agents are active for a feature
+ * @param {string} projectPath - Root path of the project
+ * @param {string} featureName - Feature name
+ * @returns {boolean} True if UI agents are active
+ */
+export function hasUIAgentsActive(projectPath, featureName) {
+  try {
+    const statePath = join(projectPath, '.morph/state.json');
+
+    if (!existsSync(statePath)) {
+      return false;
+    }
+
+    const state = JSON.parse(readFileSync(statePath, 'utf8'));
+
+    // Handle both array and object format
+    let feature;
+    if (Array.isArray(state.features)) {
+      feature = state.features.find(f => f.name === featureName);
+    } else if (state.features && typeof state.features === 'object') {
+      feature = state.features[featureName];
+    }
+
+    if (!feature || !feature.activeAgents) {
+      return false;
+    }
+
+    // UI design agents that require a design system before implement phase.
+    // Implementation-only agents (nextjs-expert, css-specialist)
+    // build from existing designs and do NOT trigger this gate.
+    const uiAgents = [
+      'ui-designer',
+      'uiux-designer',
+      'ui-ux-designer',
+    ];
+
+    return feature.activeAgents.some(agentId => uiAgents.includes(agentId));
+  } catch {
+    return false;
+  }
+}
+
+/**
+ * Get recommended design system locations based on project type
+ * @param {string} projectPath - Root path of the project
+ * @returns {Object} { markdown, css, description }
+ */
+export function getRecommendedLocations(projectPath) {
+  try {
+    const configPath = join(projectPath, '.morph/config/config.json');
+
+    let projectType = 'unknown';
+    if (existsSync(configPath)) {
+      const config = JSON.parse(readFileSync(configPath, 'utf8'));
+      projectType = config.project?.type || 'unknown';
+    }
+
+    // Default locations
+    const locations = {
+      markdown: '.morph/context/design-system.md',
+      css: 'public/design-system.css',
+      description: 'Project-level design system (shared across features)'
+    };
+
+    // Adjust based on project type
+    if (projectType === 'nextjs' || projectType.includes('nextjs')) {
+      locations.css = 'styles/design-system.css';
+    }
+
+    return locations;
+  } catch {
+    return {
+      markdown: '.morph/context/design-system.md',
+      css: 'wwwroot/css/design-system.css',
+      description: 'Project-level design system (shared across features)'
+    };
+  }
+}