@contentful/experience-design-system-cli 2.2.1

package/dist/src/analyze/command.js

@@ -0,0 +1,175 @@
+import { createElement } from 'react';
+import { render } from 'ink';
+import { mkdir, readdir, stat } from 'node:fs/promises';
+import { isAbsolute, join, resolve } from 'node:path';
+import { extractComponents } from './extract/pipeline.js';
+import { AnalyzeView } from './tui/AnalyzeView.js';
+import { registerAnalyzeEditCommand } from './select/command.js';
+import { registerAnalyzeSelectAgentCommand } from './select-agent/command.js';
+import { openPipelineDb, getOrCreateSession, createStep, updateStep, storeRawComponents } from '../session/db.js';
+import { preClassifyComponent } from './pre-classify.js';
+const SCANNED_FILE_EXTENSIONS = new Set(['.astro', '.js', '.jsx', '.ts', '.tsx', '.vue']);
+const IGNORED_DIRECTORY_NAMES = new Set([
+    '.git',
+    '.next',
+    '.nuxt',
+    'build',
+    'coverage',
+    'demo',
+    'demos',
+    'dist',
+    'example',
+    'examples',
+    'node_modules',
+    'out',
+    'storybook-static',
+]);
+const IGNORED_FILE_SUFFIXES = new Set([
+    '.stories.ts',
+    '.stories.tsx',
+    '.stories.js',
+    '.stories.jsx',
+    '.story.ts',
+    '.story.tsx',
+    '.story.js',
+    '.story.jsx',
+    '.spec.ts',
+    '.spec.tsx',
+    '.test.ts',
+    '.test.tsx',
+]);
+function pluralize(count, singular, plural = `${singular}s`) {
+    return `${count} ${count === 1 ? singular : plural}`;
+}
+function resolveFromProjectRoot(projectRoot, inputPath) {
+    return isAbsolute(inputPath) ? inputPath : resolve(projectRoot, inputPath);
+}
+async function pathExists(path) {
+    return Boolean(await stat(path).catch(() => null));
+}
+export async function collectSourceFiles(directory, onProgress) {
+    const files = [];
+    async function visit(currentDirectory) {
+        const entries = await readdir(currentDirectory, { withFileTypes: true });
+        const subdirs = [];
+        for (const entry of entries) {
+            const fullPath = join(currentDirectory, entry.name);
+            if (entry.isDirectory()) {
+                if (!IGNORED_DIRECTORY_NAMES.has(entry.name)) {
+                    subdirs.push(fullPath);
+                }
+                continue;
+            }
+            if (!entry.isFile()) {
+                continue;
+            }
+            const extension = entry.name.slice(entry.name.lastIndexOf('.'));
+            if (!SCANNED_FILE_EXTENSIONS.has(extension) || entry.name.endsWith('.d.ts')) {
+                continue;
+            }
+            if ([...IGNORED_FILE_SUFFIXES].some((suffix) => entry.name.endsWith(suffix))) {
+                continue;
+            }
+            files.push(fullPath);
+            onProgress?.(files.length);
+        }
+        await Promise.all(subdirs.map((subdir) => visit(subdir)));
+    }
+    await visit(directory);
+    return files.sort();
+}
+export function registerAnalyzeCommand(program) {
+    const analyze = program
+        .command('analyze')
+        .description('Extract component definitions from a project, or correct analysis output');
+    analyze
+        .command('extract')
+        .description('Extract component definitions from a project')
+        .requiredOption('--project <path>', 'Path to the project root')
+        .option('--dir <path>', 'Path to the component source directory relative to the project root')
+        .action(async (opts) => {
+        const projectRoot = resolve(opts.project);
+        const outDir = join(projectRoot, '.contentful');
+        let sourceDirectory;
+        if (opts.dir !== undefined) {
+            sourceDirectory = resolveFromProjectRoot(projectRoot, opts.dir);
+            if (!(await pathExists(sourceDirectory))) {
+                process.stderr.write(`Error: source directory does not exist: ${sourceDirectory}\n`);
+                process.exit(1);
+            }
+        }
+        else {
+            const srcPath = resolveFromProjectRoot(projectRoot, 'src');
+            sourceDirectory = (await pathExists(srcPath)) ? srcPath : projectRoot;
+        }
+        const sourceFiles = await collectSourceFiles(sourceDirectory, (count) => {
+            if (!process.stdout.isTTY) {
+                process.stderr.write(`progress=scan:${count}\n`);
+            }
+        });
+        const extraction = await extractComponents(sourceFiles, ({ filesProcessed, componentsFound }) => {
+            if (!process.stdout.isTTY) {
+                process.stderr.write(`progress=extract:${filesProcessed}/${sourceFiles.length}:${componentsFound}\n`);
+            }
+        });
+        await mkdir(outDir, { recursive: true });
+        const db = openPipelineDb();
+        const { sessionId } = getOrCreateSession(db, undefined, undefined, {
+            command: 'analyze extract',
+            inputPath: projectRoot,
+            outDir,
+        });
+        const stepId = createStep(db, sessionId, 'analyze extract', { project: projectRoot });
+        const classifiedComponents = extraction.components.map(preClassifyComponent);
+        storeRawComponents(db, sessionId, classifiedComponents);
+        updateStep(db, stepId, 'complete', { sessionId });
+        db.close();
+        const zeroPropComponents = classifiedComponents.filter((c) => c.props.length === 0 && c.slots.length === 0);
+        const analyzeResult = {
+            sourceDirectory,
+            sessionId,
+            fileCount: sourceFiles.length,
+            components: classifiedComponents.map((c) => ({
+                name: c.name,
+                framework: c.framework,
+                propCount: c.props.length,
+                slotCount: c.slots.length,
+                warnings: extraction.warnings.filter((w) => w.startsWith(c.name + ':')),
+            })),
+            totalWarnings: extraction.warnings.length,
+            zeroPropComponents: zeroPropComponents.map((c) => ({ name: c.name, source: c.source })),
+        };
+        if (process.stdout.isTTY) {
+            const { waitUntilExit } = render(createElement(AnalyzeView, {
+                result: analyzeResult,
+                onExit: () => process.exit(0),
+            }));
+            await waitUntilExit();
+        }
+        else {
+            const sessionLine = `session=${sessionId}\n`;
+            process.stdout.write(sessionLine);
+            const summaryLines = [
+                `Scanned ${pluralize(sourceFiles.length, 'source file')} in ${sourceDirectory}`,
+                `Extracted ${pluralize(extraction.components.length, 'component')}`,
+            ];
+            if (zeroPropComponents.length > 0) {
+                summaryLines.push(`Warning: ${pluralize(zeroPropComponents.length, 'component')} extracted with 0 props and 0 slots:`);
+                summaryLines.push(...zeroPropComponents.map((c) => `  ${c.name} (${c.source})`));
+                summaryLines.push('These may be Storybook stories, context providers, or SSR utilities.');
+                summaryLines.push("Review them in 'analyze select' before generating.");
+            }
+            if (extraction.warnings.length > 0) {
+                summaryLines.push(`Warnings (${extraction.warnings.length}):`);
+                summaryLines.push(...extraction.warnings.map((w) => `- ${w}`));
+            }
+            else {
+                summaryLines.push('Warnings: none');
+            }
+            process.stderr.write(summaryLines.join('\n') + '\n');
+            process.exit(0);
+        }
+    });
+    registerAnalyzeEditCommand(analyze);
+    registerAnalyzeSelectAgentCommand(analyze);
+}

package/dist/src/analyze/extract/astro.d.ts

@@ -0,0 +1,5 @@
+import type { ComponentExtractionResult } from '../../types.js';
+export declare function extractAstroComponents(filePaths: string[], onProgress?: (p: {
+    filesProcessed: number;
+    componentsFound: number;
+}) => void): Promise<ComponentExtractionResult>;

package/dist/src/analyze/extract/astro.js

@@ -0,0 +1,280 @@
+import { basename } from 'node:path';
+import { readFile } from 'node:fs/promises';
+import os from 'node:os';
+import { Project, Node } from 'ts-morph';
+function extractAllowedValues(typeText) {
+    // Check if the type is a union of string literals like 'a' | 'b' | 'c'
+    const parts = typeText.split('|').map((p) => p.trim());
+    const literals = parts.filter((p) => /^['"]/.test(p)).map((p) => p.replace(/^['"]|['"]$/g, ''));
+    return literals.length >= 2 ? literals.sort() : undefined;
+}
+function usesAstroProps(initializer) {
+    if (!initializer)
+        return false;
+    if (initializer.getText() === 'Astro.props')
+        return true;
+    let found = false;
+    initializer.forEachDescendant((node) => {
+        if (found)
+            return false;
+        if (Node.isPropertyAccessExpression(node) && node.getText() === 'Astro.props') {
+            found = true;
+            return false;
+        }
+        return undefined;
+    });
+    return found;
+}
+function extractBindingPropName(element) {
+    if (element.getText().startsWith('...'))
+        return null;
+    return element.getPropertyNameNode()?.getText() ?? element.getNameNode().getText();
+}
+function extractFallbackPropsFromFrontmatter(frontmatter) {
+    const project = new Project({
+        compilerOptions: {
+            strict: false,
+            target: 99,
+            module: 99,
+            allowJs: true,
+        },
+        useInMemoryFileSystem: true,
+        skipAddingFilesFromTsConfig: true,
+    });
+    const sf = project.createSourceFile('__frontmatter__.ts', frontmatter);
+    const props = new Map();
+    sf.forEachDescendant((node) => {
+        if (!Node.isVariableDeclaration(node))
+            return;
+        const initializer = node.getInitializer();
+        if (!usesAstroProps(initializer))
+            return;
+        const nameNode = node.getNameNode();
+        if (!Node.isObjectBindingPattern(nameNode))
+            return;
+        for (const element of nameNode.getElements()) {
+            const propName = extractBindingPropName(element);
+            if (!propName)
+                continue;
+            props.set(propName, {
+                name: propName,
+                type: 'any',
+                required: !element.getInitializer(),
+            });
+        }
+    });
+    return [...props.values()].sort((a, b) => a.name.localeCompare(b.name));
+}
+function mergeProps(...propGroups) {
+    const merged = new Map();
+    for (const props of propGroups) {
+        for (const prop of props) {
+            const existing = merged.get(prop.name);
+            merged.set(prop.name, existing
+                ? {
+                    ...existing,
+                    ...prop,
+                    required: existing.required && prop.required,
+                }
+                : prop);
+        }
+    }
+    return [...merged.values()].sort((a, b) => a.name.localeCompare(b.name));
+}
+function extractPropsFromFrontmatter(frontmatter) {
+    const project = new Project({
+        compilerOptions: {
+            strict: false,
+            target: 99, // ESNext
+            module: 99, // ESNext
+            allowJs: true,
+        },
+        useInMemoryFileSystem: true,
+        skipAddingFilesFromTsConfig: true,
+    });
+    const sf = project.createSourceFile('__frontmatter__.ts', frontmatter);
+    const props = [];
+    // Find `interface Props` or `type Props = ...`
+    const propsInterface = sf.getInterface('Props');
+    const propsTypeAlias = sf.getTypeAlias('Props');
+    if (propsInterface) {
+        for (const member of propsInterface.getProperties()) {
+            const name = member.getName();
+            const typeText = member.getTypeNode()?.getText() ?? 'any';
+            const required = !member.hasQuestionToken();
+            const allowedValues = extractAllowedValues(typeText);
+            props.push({
+                name,
+                type: typeText,
+                required,
+                ...(allowedValues && { allowedValues }),
+            });
+        }
+    }
+    else if (propsTypeAlias) {
+        const type = propsTypeAlias.getType();
+        for (const property of type.getProperties()) {
+            const name = property.getName();
+            const decl = property.getValueDeclaration() ?? property.getDeclarations()[0];
+            if (!decl)
+                continue;
+            const propType = property.getTypeAtLocation(decl);
+            const typeText = propType.getText(decl);
+            const required = !property.isOptional();
+            const allowedValues = extractAllowedValues(typeText);
+            props.push({
+                name,
+                type: typeText,
+                required,
+                ...(allowedValues && { allowedValues }),
+            });
+        }
+    }
+    return props.sort((a, b) => a.name.localeCompare(b.name));
+}
+function extractDefaultsFromFrontmatter(frontmatter) {
+    const defaults = new Map();
+    const project = new Project({
+        compilerOptions: {
+            strict: false,
+            target: 99,
+            module: 99,
+            allowJs: true,
+        },
+        useInMemoryFileSystem: true,
+        skipAddingFilesFromTsConfig: true,
+    });
+    const sf = project.createSourceFile('__frontmatter__.ts', frontmatter);
+    sf.forEachDescendant((node) => {
+        if (!Node.isVariableDeclaration(node))
+            return;
+        const initializer = node.getInitializer();
+        if (!initializer)
+            return;
+        if (!usesAstroProps(initializer))
+            return;
+        const nameNode = node.getNameNode();
+        if (!Node.isObjectBindingPattern(nameNode))
+            return;
+        for (const element of nameNode.getElements()) {
+            const propName = extractBindingPropName(element);
+            if (!propName)
+                continue;
+            const elementInitializer = element.getInitializer();
+            if (!elementInitializer)
+                continue;
+            const value = elementInitializer.getText().replace(/^['"]|['"]$/g, '');
+            defaults.set(propName, value);
+        }
+    });
+    return defaults;
+}
+function extractSlotsFromTemplate(template) {
+    const slots = [];
+    const seen = new Set();
+    const slotRegex = /<slot(?:\s+name=["']([^"']+)["'])?\s*\/?>/g;
+    let match;
+    while ((match = slotRegex.exec(template)) !== null) {
+        const slotName = match[1] ?? 'default';
+        if (!seen.has(slotName)) {
+            seen.add(slotName);
+            slots.push({ name: slotName, isDefault: slotName === 'default' });
+        }
+    }
+    return slots;
+}
+function extractSlotsFromFrontmatter(frontmatter) {
+    const slots = [];
+    const seen = new Set();
+    const slotRenderRegex = /Astro\.slots\.render\(\s*['"]([^'"]+)['"]\s*\)/g;
+    let match;
+    while ((match = slotRenderRegex.exec(frontmatter)) !== null) {
+        const slotName = match[1];
+        if (!seen.has(slotName)) {
+            seen.add(slotName);
+            slots.push({ name: slotName, isDefault: slotName === 'default' });
+        }
+    }
+    return slots;
+}
+function mergeSlots(...slotGroups) {
+    const merged = [];
+    const seen = new Set();
+    for (const slots of slotGroups) {
+        for (const slot of slots) {
+            if (seen.has(slot.name))
+                continue;
+            seen.add(slot.name);
+            merged.push(slot);
+        }
+    }
+    return merged;
+}
+function extractFromAstroFile(filePath, source) {
+    const name = basename(filePath, '.astro');
+    // Split on `---` fences: frontmatter is between first and second `---`
+    // If there is no `---`, the entire file is a template-only component
+    const fenceIndex = source.startsWith('---') ? 0 : -1;
+    let frontmatter = '';
+    let template = source;
+    if (fenceIndex !== -1) {
+        const endFenceIndex = source.indexOf('---', fenceIndex + 3);
+        if (endFenceIndex !== -1) {
+            frontmatter = source.slice(fenceIndex + 3, endFenceIndex);
+            template = source.slice(endFenceIndex + 3);
+        }
+    }
+    const props = frontmatter
+        ? mergeProps(extractFallbackPropsFromFrontmatter(frontmatter), extractPropsFromFrontmatter(frontmatter))
+        : [];
+    const defaults = frontmatter ? extractDefaultsFromFrontmatter(frontmatter) : new Map();
+    const propsWithDefaults = props.map((p) => {
+        const defaultValue = defaults.get(p.name);
+        return defaultValue ? { ...p, defaultValue } : p;
+    });
+    const slots = mergeSlots(extractSlotsFromTemplate(template), extractSlotsFromFrontmatter(frontmatter));
+    return {
+        name,
+        source: filePath,
+        framework: 'astro',
+        props: propsWithDefaults,
+        slots,
+    };
+}
+const ASTRO_EXTRACT_CONCURRENCY = Number(process.env['EDS_EXTRACT_CONCURRENCY'] ?? 0) || os.cpus().length;
+export async function extractAstroComponents(filePaths, onProgress) {
+    const astroFiles = filePaths.filter((f) => f.endsWith('.astro'));
+    if (astroFiles.length === 0) {
+        return { components: [], warnings: [] };
+    }
+    const warnings = [];
+    const components = [];
+    let filesProcessed = 0;
+    let componentsFound = 0;
+    const queue = [...astroFiles];
+    async function worker() {
+        while (queue.length > 0) {
+            const filePath = queue.shift();
+            if (!filePath)
+                break;
+            try {
+                const source = await readFile(filePath, 'utf-8');
+                const component = extractFromAstroFile(filePath, source);
+                if (component) {
+                    components.push(component);
+                    componentsFound++;
+                }
+            }
+            catch (e) {
+                warnings.push(`Failed to extract from ${filePath}: ${e instanceof Error ? e.message : String(e)}`);
+            }
+            filesProcessed++;
+            onProgress?.({ filesProcessed, componentsFound });
+        }
+    }
+    await Promise.all(Array.from({ length: Math.min(ASTRO_EXTRACT_CONCURRENCY, astroFiles.length) }, worker));
+    return {
+        components: components.sort((a, b) => a.name.localeCompare(b.name)),
+        warnings,
+    };
+}

package/dist/src/analyze/extract/pipeline.d.ts

@@ -0,0 +1,6 @@
+import type { ComponentExtractionResult } from '../../types.js';
+export type ExtractProgress = {
+    filesProcessed: number;
+    componentsFound: number;
+};
+export declare function extractComponents(filePaths: string[], onProgress?: (progress: ExtractProgress) => void): Promise<ComponentExtractionResult>;