codemeld 2.1.0

package/dist/parsers/framework-parser.js

@@ -0,0 +1,770 @@
+/**
+ * Framework Component Parser
+ *
+ * Parses React (.tsx/.jsx), Vue (.vue SFC), Svelte (.svelte), Angular (.ts @Component),
+ * and Next.js components back into structured data for reverse conversion to HTML/CSS/JS.
+ */
+import { readFile, readdir, stat } from 'fs/promises';
+import { join, extname, basename, dirname, relative } from 'path';
+// ─── Framework Detection ────────────────────────────────────────────
+export async function detectFramework(projectDir) {
+    try {
+        const pkgJson = JSON.parse(await readFile(join(projectDir, 'package.json'), 'utf-8'));
+        const allDeps = { ...pkgJson.dependencies, ...pkgJson.devDependencies };
+        if (allDeps['next'])
+            return 'nextjs';
+        if (allDeps['@angular/core'])
+            return 'angular';
+        if (allDeps['svelte'] || allDeps['@sveltejs/kit'])
+            return 'svelte';
+        if (allDeps['vue'])
+            return 'vue';
+        if (allDeps['react'])
+            return 'react';
+    }
+    catch { /* no package.json */ }
+    // Fallback: check for framework-specific config files
+    try {
+        await stat(join(projectDir, 'next.config.ts'));
+        return 'nextjs';
+    }
+    catch { }
+    try {
+        await stat(join(projectDir, 'next.config.js'));
+        return 'nextjs';
+    }
+    catch { }
+    try {
+        await stat(join(projectDir, 'angular.json'));
+        return 'angular';
+    }
+    catch { }
+    try {
+        await stat(join(projectDir, 'svelte.config.js'));
+        return 'svelte';
+    }
+    catch { }
+    try {
+        await stat(join(projectDir, 'vite.config.ts'));
+        // Could be React or Vue — check for vue plugin
+        const config = await readFile(join(projectDir, 'vite.config.ts'), 'utf-8');
+        if (config.includes('@vitejs/plugin-vue'))
+            return 'vue';
+        return 'react';
+    }
+    catch { }
+    return 'react'; // default
+}
+// ─── Main Project Parser ────────────────────────────────────────────
+export async function parseFrameworkProject(projectDir) {
+    const framework = await detectFramework(projectDir);
+    const result = {
+        framework,
+        projectName: basename(projectDir),
+        components: [],
+        routes: [],
+        globalCSS: [],
+        externalStyles: [],
+        externalScripts: [],
+        preconnectLinks: [],
+        title: '',
+        meta: {},
+    };
+    // Parse project title and meta from index.html or equivalent
+    await parseProjectMeta(projectDir, framework, result);
+    // Discover and parse components
+    const componentFiles = await discoverComponentFiles(projectDir, framework);
+    for (const file of componentFiles) {
+        try {
+            const content = await readFile(file, 'utf-8');
+            const relPath = relative(projectDir, file);
+            const component = parseComponentFile(content, relPath, framework);
+            if (component) {
+                result.components.push(component);
+            }
+        }
+        catch { /* skip unparseable files */ }
+    }
+    // Parse routes
+    result.routes = await parseRoutes(projectDir, framework, result.components);
+    // Collect global CSS
+    await collectGlobalCSS(projectDir, framework, result);
+    return result;
+}
+// ─── Component File Discovery ───────────────────────────────────────
+async function discoverComponentFiles(projectDir, framework) {
+    const files = [];
+    const extensions = getComponentExtensions(framework);
+    let searchDirs;
+    switch (framework) {
+        case 'nextjs':
+            searchDirs = [join(projectDir, 'app'), join(projectDir, 'src')];
+            break;
+        case 'svelte':
+            searchDirs = [join(projectDir, 'src')];
+            break;
+        case 'angular':
+            searchDirs = [join(projectDir, 'src', 'app')];
+            break;
+        case 'vue':
+            searchDirs = [join(projectDir, 'src')];
+            break;
+        default: // react
+            searchDirs = [join(projectDir, 'src')];
+    }
+    for (const dir of searchDirs) {
+        await walkDir(dir, extensions, files);
+    }
+    return files;
+}
+function getComponentExtensions(framework) {
+    switch (framework) {
+        case 'vue': return ['.vue'];
+        case 'svelte': return ['.svelte'];
+        case 'angular': return ['.ts']; // Angular components are .ts
+        default: return ['.tsx', '.jsx'];
+    }
+}
+async function walkDir(dir, extensions, result) {
+    let entries;
+    try {
+        entries = await readdir(dir, { withFileTypes: true });
+    }
+    catch {
+        return;
+    }
+    for (const entry of entries) {
+        const fullPath = join(dir, entry.name);
+        if (entry.isDirectory()) {
+            if (['node_modules', '.git', 'dist', 'build', '.next', '.svelte-kit', '.angular'].includes(entry.name))
+                continue;
+            await walkDir(fullPath, extensions, result);
+        }
+        else if (entry.isFile()) {
+            const ext = extname(entry.name);
+            if (extensions.includes(ext)) {
+                // Skip config/utility files
+                if (entry.name.startsWith('vite.config') || entry.name.startsWith('next.config') ||
+                    entry.name === 'main.ts' || entry.name === 'main.tsx' ||
+                    entry.name.endsWith('.d.ts') || entry.name.endsWith('.spec.ts') ||
+                    entry.name.endsWith('.test.ts') || entry.name.endsWith('.test.tsx'))
+                    continue;
+                result.push(fullPath);
+            }
+        }
+    }
+}
+// ─── Component Parsing ──────────────────────────────────────────────
+function parseComponentFile(content, relPath, framework) {
+    switch (framework) {
+        case 'react':
+        case 'nextjs':
+            return parseReactComponent(content, relPath, framework);
+        case 'vue':
+            return parseVueComponent(content, relPath);
+        case 'svelte':
+            return parseSvelteComponent(content, relPath);
+        case 'angular':
+            return parseAngularComponent(content, relPath);
+        default:
+            return null;
+    }
+}
+// ─── React/Next.js Parser ───────────────────────────────────────────
+function parseReactComponent(content, relPath, framework) {
+    const name = extractComponentName(content, relPath);
+    if (!name)
+        return null;
+    const stateVars = new Map();
+    const eventHandlers = new Map();
+    const effects = [];
+    const childComponents = [];
+    // Extract useState declarations
+    const statePattern = /const\s+\[(\w+),\s*(\w+)\]\s*=\s*useState(?:<[^>]*>)?\(([^)]*)\)/g;
+    let match;
+    while ((match = statePattern.exec(content)) !== null) {
+        stateVars.set(match[1], match[3] || "''");
+    }
+    // Extract useEffect
+    const effectPattern = /useEffect\(\(\)\s*=>\s*\{([\s\S]*?)\},\s*\[[^\]]*\]\)/g;
+    while ((match = effectPattern.exec(content)) !== null) {
+        effects.push(match[1].trim());
+    }
+    // Extract event handlers: const handleX/toggleX/onX = (...) => { ... }
+    const handlerPattern = /const\s+(handle\w+|toggle\w+|on[A-Z]\w+)\s*=\s*(?:\([^)]*\)\s*=>|\(\)\s*=>)\s*\{([\s\S]*?)\n\s*\};/g;
+    while ((match = handlerPattern.exec(content)) !== null) {
+        eventHandlers.set(match[1], match[2].trim());
+    }
+    // Also extract function declaration handlers
+    const fnHandlerPattern = /function\s+(handle\w+|toggle\w+|on[A-Z]\w+)\s*\([^)]*\)\s*\{([\s\S]*?)\n\s*\}/g;
+    while ((match = fnHandlerPattern.exec(content)) !== null) {
+        if (!eventHandlers.has(match[1])) {
+            eventHandlers.set(match[1], match[2].trim());
+        }
+    }
+    // Extract JSX from return statement
+    const template = extractJSXReturn(content);
+    // Extract CSS imports
+    let css = '';
+    const cssImportPattern = /import\s+['"]\.\/([^'"]+\.css)['"]/g;
+    while ((match = cssImportPattern.exec(content)) !== null) {
+        // CSS will be collected separately
+    }
+    // Detect child component imports
+    const importPattern = /import\s+(\w+)\s+from\s+['"]\.\/([^'"]+)['"]/g;
+    while ((match = importPattern.exec(content)) !== null) {
+        if (/^[A-Z]/.test(match[1])) {
+            childComponents.push(match[1]);
+        }
+    }
+    // Detect Link imports (react-router or next/link)
+    const usesLink = /import.*Link.*from\s+['"](?:react-router-dom|next\/link)['"]/.test(content);
+    return {
+        filePath: relPath,
+        name,
+        framework,
+        template: template || '',
+        css,
+        script: '',
+        stateVars,
+        eventHandlers,
+        effects,
+        isInteractive: stateVars.size > 0 || eventHandlers.size > 0 || effects.length > 0,
+        childComponents,
+    };
+}
+function extractComponentName(content, relPath) {
+    // export default function ComponentName
+    let match = content.match(/(?:export\s+default\s+)?function\s+([A-Z]\w+)\s*\(/);
+    if (match)
+        return match[1];
+    // const ComponentName = ...
+    match = content.match(/(?:export\s+default\s+)?const\s+([A-Z]\w+)\s*[=:]/);
+    if (match)
+        return match[1];
+    // export default ComponentName
+    match = content.match(/export\s+default\s+([A-Z]\w+)/);
+    if (match)
+        return match[1];
+    // Derive from filename
+    const base = basename(relPath).replace(/\.\w+$/, '');
+    if (/^[A-Z]/.test(base))
+        return base;
+    return base.charAt(0).toUpperCase() + base.slice(1).replace(/-(\w)/g, (_, c) => c.toUpperCase());
+}
+function extractJSXReturn(content) {
+    // Find the LAST `return (` that contains JSX (the component's main return)
+    // Search from the end of the file backwards to skip handler returns
+    const returnPattern = /return\s*\(/g;
+    const candidates = [];
+    let match;
+    while ((match = returnPattern.exec(content)) !== null) {
+        candidates.push(match.index);
+    }
+    // Try each candidate from LAST to FIRST — the component's main return
+    // is usually the last one (closest to the end of the file)
+    for (let ci = candidates.length - 1; ci >= 0; ci--) {
+        const returnIdx = candidates[ci];
+        const start = content.indexOf('(', returnIdx);
+        if (start === -1)
+            continue;
+        let depth = 1;
+        let i = start + 1;
+        // Track JSX brace depth to know when we're in a JS expression vs text
+        let braceDepth = 0;
+        // Track whether we're inside an HTML tag definition (between < and >)
+        let inTag = false;
+        while (i < content.length && depth > 0) {
+            // Skip /* ... */ comments
+            if (content[i] === '/' && content[i + 1] === '*') {
+                i += 2;
+                while (i < content.length - 1 && !(content[i] === '*' && content[i + 1] === '/')) {
+                    i++;
+                }
+                i += 2;
+                continue;
+            }
+            // Skip // line comments
+            if (content[i] === '/' && content[i + 1] === '/') {
+                while (i < content.length && content[i] !== '\n')
+                    i++;
+                i++;
+                continue;
+            }
+            // Track JSX braces for expression context
+            if (content[i] === '{') {
+                braceDepth++;
+                i++;
+                continue;
+            }
+            if (content[i] === '}' && braceDepth > 0) {
+                braceDepth--;
+                i++;
+                continue;
+            }
+            // Track HTML tag context
+            if (content[i] === '<' && braceDepth === 0) {
+                inTag = true;
+            }
+            if (content[i] === '>' && inTag && braceDepth === 0) {
+                inTag = false;
+            }
+            // Handle string literals — only when inside a JS expression ({...}) or tag attribute
+            // In JSX text content (between > and <), quotes are just text, not string delimiters
+            if ((content[i] === '"' || content[i] === "'" || content[i] === '`') && (braceDepth > 0 || inTag)) {
+                const quote = content[i];
+                i++;
+                while (i < content.length && content[i] !== quote) {
+                    if (content[i] === '\\')
+                        i++; // skip escaped chars
+                    i++;
+                }
+            }
+            else if (content[i] === '(') {
+                depth++;
+            }
+            else if (content[i] === ')') {
+                depth--;
+            }
+            i++;
+        }
+        if (depth !== 0)
+            continue;
+        let jsx = content.slice(start + 1, i - 1).trim();
+        // Check if this actually contains JSX (has HTML-like tags)
+        if (/<\w/.test(jsx) || /^\s*</.test(jsx)) {
+            // Remove wrapping fragments
+            jsx = jsx
+                .replace(/^\s*<>\s*/, '')
+                .replace(/\s*<\/>\s*$/, '')
+                .replace(/^\s*<React\.Fragment>\s*/, '')
+                .replace(/\s*<\/React\.Fragment>\s*$/, '')
+                .trim();
+            // Remove any trailing non-HTML code leaked after the template
+            // (catches export statements, multi-line comments, etc.)
+            // Split by lines and find where non-HTML content starts
+            const jsxLines = jsx.split('\n');
+            let truncateAt = jsxLines.length;
+            for (let li = jsxLines.length - 1; li >= 0; li--) {
+                const line = jsxLines[li].trim();
+                if (!line)
+                    continue; // skip blank lines
+                // If line looks like JS code (export, function, var, const, /*, etc.) not HTML
+                if (/^(export\s|function\s|const\s|let\s|var\s|\/\*|\/\/|\*\s*$|\*\s+|^\*\/|import\s|}\s*;?\s*$)/.test(line) || line.startsWith('*')) {
+                    truncateAt = li;
+                }
+                else {
+                    break; // Found a line that looks like HTML, stop
+                }
+            }
+            if (truncateAt < jsxLines.length) {
+                jsx = jsxLines.slice(0, truncateAt).join('\n').trim();
+            }
+            return jsx;
+        }
+    }
+    return null;
+}
+// ─── Vue SFC Parser ─────────────────────────────────────────────────
+function parseVueComponent(content, relPath) {
+    const name = basename(relPath).replace(/\.vue$/, '');
+    const pascalName = name.charAt(0).toUpperCase() + name.slice(1).replace(/-(\w)/g, (_, c) => c.toUpperCase());
+    const stateVars = new Map();
+    const eventHandlers = new Map();
+    const effects = [];
+    const childComponents = [];
+    // Extract <template> content
+    const templateMatch = content.match(/<template>([\s\S]*?)<\/template>/);
+    const template = templateMatch ? templateMatch[1].trim() : '';
+    // Extract <script setup> content
+    const scriptMatch = content.match(/<script\s+setup[^>]*>([\s\S]*?)<\/script>/);
+    const script = scriptMatch ? scriptMatch[1].trim() : '';
+    // Extract <style> content
+    const styleMatch = content.match(/<style[^>]*>([\s\S]*?)<\/style>/);
+    const css = styleMatch ? styleMatch[1].trim() : '';
+    // Parse ref() declarations from script
+    const refPattern = /const\s+(\w+)\s*=\s*ref(?:<[^>]*>)?\(([^)]*)\)/g;
+    let match;
+    while ((match = refPattern.exec(script)) !== null) {
+        stateVars.set(match[1], match[2] || "''");
+    }
+    // Parse event handlers
+    const handlerPattern = /const\s+(\w+)\s*=\s*(?:\([^)]*\)\s*=>|\(\)\s*=>)\s*\{([\s\S]*?)\n\s*\};?/g;
+    while ((match = handlerPattern.exec(script)) !== null) {
+        eventHandlers.set(match[1], match[2].trim());
+    }
+    // Parse function handlers
+    const fnHandlerPattern = /function\s+(\w+)\s*\([^)]*\)\s*\{([\s\S]*?)\n\s*\}/g;
+    while ((match = fnHandlerPattern.exec(script)) !== null) {
+        eventHandlers.set(match[1], match[2].trim());
+    }
+    // Parse onMounted effects
+    const mountedPattern = /onMounted\(\(\)\s*=>\s*\{([\s\S]*?)\}\)/g;
+    while ((match = mountedPattern.exec(script)) !== null) {
+        effects.push(match[1].trim());
+    }
+    // Import detection
+    const importPattern = /import\s+(\w+)\s+from\s+['"][^'"]*['"]/g;
+    while ((match = importPattern.exec(script)) !== null) {
+        if (/^[A-Z]/.test(match[1]))
+            childComponents.push(match[1]);
+    }
+    return {
+        filePath: relPath,
+        name: pascalName,
+        framework: 'vue',
+        template,
+        css,
+        script,
+        stateVars,
+        eventHandlers,
+        effects,
+        isInteractive: stateVars.size > 0 || eventHandlers.size > 0 || effects.length > 0,
+        childComponents,
+    };
+}
+// ─── Svelte Parser ──────────────────────────────────────────────────
+function parseSvelteComponent(content, relPath) {
+    const name = basename(relPath).replace(/\.svelte$/, '');
+    const pascalName = name.charAt(0).toUpperCase() + name.slice(1).replace(/-(\w)/g, (_, c) => c.toUpperCase());
+    const stateVars = new Map();
+    const eventHandlers = new Map();
+    const effects = [];
+    const childComponents = [];
+    // Extract <script> content
+    const scriptMatch = content.match(/<script[^>]*>([\s\S]*?)<\/script>/);
+    const script = scriptMatch ? scriptMatch[1].trim() : '';
+    // Extract <style> content
+    const styleMatch = content.match(/<style[^>]*>([\s\S]*?)<\/style>/);
+    const css = styleMatch ? styleMatch[1].trim() : '';
+    // Template is everything outside script and style tags
+    let template = content
+        .replace(/<script[^>]*>[\s\S]*?<\/script>/g, '')
+        .replace(/<style[^>]*>[\s\S]*?<\/style>/g, '')
+        .trim();
+    // Parse $state() declarations
+    const statePattern = /let\s+(\w+)\s*=\s*\$state\(([^)]*)\)/g;
+    let match;
+    while ((match = statePattern.exec(script)) !== null) {
+        stateVars.set(match[1], match[2] || "''");
+    }
+    // Parse regular let declarations (Svelte 4 reactive)
+    const letPattern = /let\s+(\w+)\s*=\s*([^;]+);/g;
+    while ((match = letPattern.exec(script)) !== null) {
+        if (!match[2].includes('$state') && !match[2].includes('import')) {
+            stateVars.set(match[1], match[2].trim());
+        }
+    }
+    // Parse function handlers
+    const fnPattern = /function\s+(\w+)\s*\([^)]*\)\s*\{([\s\S]*?)\n\s*\}/g;
+    while ((match = fnPattern.exec(script)) !== null) {
+        eventHandlers.set(match[1], match[2].trim());
+    }
+    // Parse $effect()
+    const effectPattern = /\$effect\(\(\)\s*=>\s*\{([\s\S]*?)\}\)/g;
+    while ((match = effectPattern.exec(script)) !== null) {
+        effects.push(match[1].trim());
+    }
+    // Parse onMount
+    const mountPattern = /onMount\(\(\)\s*=>\s*\{([\s\S]*?)\}\)/g;
+    while ((match = mountPattern.exec(script)) !== null) {
+        effects.push(match[1].trim());
+    }
+    return {
+        filePath: relPath,
+        name: pascalName,
+        framework: 'svelte',
+        template,
+        css,
+        script,
+        stateVars,
+        eventHandlers,
+        effects,
+        isInteractive: stateVars.size > 0 || eventHandlers.size > 0 || effects.length > 0,
+        childComponents,
+    };
+}
+// ─── Angular Parser ─────────────────────────────────────────────────
+function parseAngularComponent(content, relPath) {
+    // Must have @Component decorator
+    if (!content.includes('@Component'))
+        return null;
+    const name = basename(relPath).replace(/\.component\.ts$/, '').replace(/\.ts$/, '');
+    const pascalName = name.charAt(0).toUpperCase() + name.slice(1).replace(/-(\w)/g, (_, c) => c.toUpperCase());
+    const stateVars = new Map();
+    const eventHandlers = new Map();
+    const effects = [];
+    const childComponents = [];
+    // Extract inline template
+    const templateMatch = content.match(/template:\s*`([\s\S]*?)`/);
+    const template = templateMatch ? templateMatch[1].trim() : '';
+    // Extract inline styles
+    const stylesMatch = content.match(/styles:\s*\[\s*`([\s\S]*?)`\s*\]/);
+    const css = stylesMatch ? stylesMatch[1].trim() : '';
+    // Parse signal() declarations
+    const signalPattern = /(\w+)\s*=\s*signal(?:<[^>]*>)?\(([^)]*)\)/g;
+    let match;
+    while ((match = signalPattern.exec(content)) !== null) {
+        stateVars.set(match[1], match[2] || "''");
+    }
+    // Parse methods (event handlers)
+    const methodPattern = /(\w+)\s*\([^)]*\)\s*\{([\s\S]*?)\n\s*\}/g;
+    while ((match = methodPattern.exec(content)) !== null) {
+        const methodName = match[1];
+        if (['constructor', 'ngOnInit', 'ngOnDestroy', 'ngAfterViewInit'].includes(methodName)) {
+            if (methodName === 'ngOnInit')
+                effects.push(match[2].trim());
+            continue;
+        }
+        eventHandlers.set(methodName, match[2].trim());
+    }
+    return {
+        filePath: relPath,
+        name: pascalName + 'Component',
+        framework: 'angular',
+        template,
+        css,
+        script: '',
+        stateVars,
+        eventHandlers,
+        effects,
+        isInteractive: stateVars.size > 0 || eventHandlers.size > 0 || effects.length > 0,
+        childComponents,
+    };
+}
+// ─── Route Parsing ──────────────────────────────────────────────────
+async function parseRoutes(projectDir, framework, components) {
+    const routes = [];
+    switch (framework) {
+        case 'react': {
+            // Parse App.tsx for React Router routes
+            try {
+                const appContent = await readFile(join(projectDir, 'src', 'App.tsx'), 'utf-8');
+                const routePattern = /<Route\s+path="([^"]+)"\s+element=\{<(\w+)\s*\/>\}/g;
+                let match;
+                while ((match = routePattern.exec(appContent)) !== null) {
+                    routes.push({
+                        path: match[1],
+                        componentName: match[2],
+                        componentFile: '',
+                        isIndex: match[1] === '/',
+                    });
+                }
+            }
+            catch { /* no App.tsx or no routes */ }
+            // If no routes found, treat it as single-page
+            if (routes.length === 0 && components.length > 0) {
+                routes.push({
+                    path: '/',
+                    componentName: components[0].name,
+                    componentFile: components[0].filePath,
+                    isIndex: true,
+                });
+            }
+            break;
+        }
+        case 'nextjs': {
+            // File-based routing: app/page.tsx, app/about/page.tsx
+            const appDir = join(projectDir, 'app');
+            const pageFiles = await findFiles(appDir, 'page.tsx');
+            for (const file of pageFiles) {
+                const relDir = relative(appDir, dirname(file));
+                const path = relDir === '' || relDir === '.' ? '/' : `/${relDir}`;
+                const content = await readFile(file, 'utf-8');
+                const nameMatch = content.match(/import\s+(\w+)\s+from/);
+                routes.push({
+                    path,
+                    componentName: nameMatch?.[1] || 'Page',
+                    componentFile: relative(projectDir, file),
+                    isIndex: path === '/',
+                });
+            }
+            break;
+        }
+        case 'vue': {
+            // Parse router/index.ts
+            try {
+                const routerContent = await readFile(join(projectDir, 'src', 'router', 'index.ts'), 'utf-8');
+                const routePattern = /path:\s*'([^']+)',\s*name:\s*'([^']+)'/g;
+                let match;
+                while ((match = routePattern.exec(routerContent)) !== null) {
+                    routes.push({
+                        path: match[1],
+                        componentName: match[2],
+                        componentFile: '',
+                        isIndex: match[1] === '/',
+                    });
+                }
+            }
+            catch { /* no router config */ }
+            break;
+        }
+        case 'svelte': {
+            // File-based routing: src/routes/+page.svelte, src/routes/about/+page.svelte
+            const routesDir = join(projectDir, 'src', 'routes');
+            const pageFiles = await findFiles(routesDir, '+page.svelte');
+            for (const file of pageFiles) {
+                const relDir = relative(routesDir, dirname(file));
+                const path = relDir === '' || relDir === '.' ? '/' : `/${relDir}`;
+                const content = await readFile(file, 'utf-8');
+                const nameMatch = content.match(/import\s+(\w+)\s+from/);
+                routes.push({
+                    path,
+                    componentName: nameMatch?.[1] || basename(dirname(file)),
+                    componentFile: relative(projectDir, file),
+                    isIndex: path === '/',
+                });
+            }
+            break;
+        }
+        case 'angular': {
+            // Parse app.routes.ts
+            try {
+                const routesContent = await readFile(join(projectDir, 'src', 'app', 'app.routes.ts'), 'utf-8');
+                // Match route blocks: { path: '...', loadComponent: ... .then((m) => m.ComponentName) }
+                const routePattern = /path:\s*'([^']*)'[\s\S]*?\.then\(\s*\(?m\)?\s*=>\s*m\.(\w+)/g;
+                let match;
+                while ((match = routePattern.exec(routesContent)) !== null) {
+                    routes.push({
+                        path: match[1] === '' ? '/' : `/${match[1]}`,
+                        componentName: match[2],
+                        componentFile: '',
+                        isIndex: match[1] === '',
+                    });
+                }
+            }
+            catch { /* no routes config */ }
+            break;
+        }
+    }
+    return routes;
+}
+async function findFiles(dir, fileName) {
+    const results = [];
+    let entries;
+    try {
+        entries = await readdir(dir, { withFileTypes: true });
+    }
+    catch {
+        return results;
+    }
+    for (const entry of entries) {
+        const fullPath = join(dir, entry.name);
+        if (entry.isDirectory()) {
+            if (entry.name === 'node_modules')
+                continue;
+            results.push(...await findFiles(fullPath, fileName));
+        }
+        else if (entry.name === fileName) {
+            results.push(fullPath);
+        }
+    }
+    return results;
+}
+// ─── Project Meta Parsing ───────────────────────────────────────────
+async function parseProjectMeta(projectDir, framework, result) {
+    // Try reading index.html
+    const indexPaths = [
+        join(projectDir, 'index.html'),
+        join(projectDir, 'public', 'index.html'),
+        join(projectDir, 'src', 'index.html'),
+        join(projectDir, 'src', 'app.html'), // SvelteKit
+    ];
+    for (const indexPath of indexPaths) {
+        try {
+            const html = await readFile(indexPath, 'utf-8');
+            const titleMatch = html.match(/<title>([^<]*)<\/title>/);
+            if (titleMatch)
+                result.title = titleMatch[1];
+            // Extract external stylesheets (both href="..." and rel="stylesheet")
+            const linkPattern = /<link[^>]*href="(https?:\/\/[^"]+)"[^>]*>/g;
+            let match;
+            while ((match = linkPattern.exec(html)) !== null) {
+                // Skip preconnect links (they're not stylesheets)
+                if (match[0].includes('rel="preconnect"'))
+                    continue;
+                // Only include if it's a stylesheet (has rel="stylesheet" or is a font link)
+                if (match[0].includes('stylesheet') || match[0].includes('fonts.googleapis')) {
+                    result.externalStyles.push(match[1]);
+                }
+            }
+            // Also match: <link rel="stylesheet" href="...">
+            const linkPattern2 = /<link[^>]*rel="stylesheet"[^>]*href="(https?:\/\/[^"]+)"/g;
+            while ((match = linkPattern2.exec(html)) !== null) {
+                if (!result.externalStyles.includes(match[1])) {
+                    result.externalStyles.push(match[1]);
+                }
+            }
+            // Match preconnect links (for fonts)
+            const preconnectPattern = /<link[^>]*rel="preconnect"[^>]*>/g;
+            while ((match = preconnectPattern.exec(html)) !== null) {
+                if (!result.preconnectLinks.includes(match[0])) {
+                    result.preconnectLinks.push(match[0]);
+                }
+            }
+            // Extract external scripts
+            const scriptPattern = /<script[^>]*src="(https?:\/\/[^"]+)"[^>]*>/g;
+            while ((match = scriptPattern.exec(html)) !== null) {
+                result.externalScripts.push(match[1]);
+            }
+            break;
+        }
+        catch {
+            continue;
+        }
+    }
+    // Get project name from package.json
+    try {
+        const pkg = JSON.parse(await readFile(join(projectDir, 'package.json'), 'utf-8'));
+        result.projectName = pkg.name || result.projectName;
+    }
+    catch { }
+}
+// ─── Global CSS Collection ──────────────────────────────────────────
+async function collectGlobalCSS(projectDir, framework, result) {
+    const cssPaths = [];
+    switch (framework) {
+        case 'react':
+            cssPaths.push(join(projectDir, 'src', 'styles', 'global.css'), join(projectDir, 'src', 'styles', 'tailwind.css'), join(projectDir, 'src', 'index.css'), join(projectDir, 'src', 'App.css'));
+            break;
+        case 'nextjs':
+            cssPaths.push(join(projectDir, 'app', 'styles', 'global.css'), join(projectDir, 'app', 'styles', 'tailwind.css'), join(projectDir, 'app', 'globals.css'));
+            break;
+        case 'vue':
+            cssPaths.push(join(projectDir, 'src', 'styles', 'global.css'), join(projectDir, 'src', 'styles', 'tailwind.css'), join(projectDir, 'src', 'assets', 'main.css'));
+            break;
+        case 'svelte':
+            cssPaths.push(join(projectDir, 'src', 'lib', 'styles', 'global.css'), join(projectDir, 'src', 'lib', 'styles', 'tailwind.css'), join(projectDir, 'src', 'app.css'));
+            break;
+        case 'angular':
+            cssPaths.push(join(projectDir, 'src', 'styles', 'global.css'), join(projectDir, 'src', 'styles.css'));
+            break;
+    }
+    for (const cssPath of cssPaths) {
+        try {
+            const css = await readFile(cssPath, 'utf-8');
+            if (css.trim())
+                result.globalCSS.push(css);
+        }
+        catch { /* file doesn't exist */ }
+    }
+    // Also collect component-level CSS files
+    const componentDir = framework === 'svelte'
+        ? join(projectDir, 'src', 'lib', 'components')
+        : framework === 'angular'
+            ? join(projectDir, 'src', 'app', 'components')
+            : framework === 'nextjs'
+                ? join(projectDir, 'app', 'components')
+                : join(projectDir, 'src', 'components');
+    try {
+        const cssFiles = [];
+        await walkDir(componentDir, ['.css'], cssFiles);
+        for (const file of cssFiles) {
+            const css = await readFile(file, 'utf-8');
+            if (css.trim())
+                result.globalCSS.push(css);
+        }
+    }
+    catch { }
+}
+//# sourceMappingURL=framework-parser.js.map