@contentful/experience-design-system-extraction 2.36.2-dev-build-c4497102.0 → 2.36.2-dev-build-a6f80ae6.0

package/dist/src/extract/scoring.d.ts

@@ -0,0 +1,12 @@
+import type { RawComponentDefinition } from '../types.js';
+export type ExtractionConfidence = 1 | 2 | 3 | 4 | 5;
+export type ExtractionScore = {
+    confidence: ExtractionConfidence;
+    reasons: string[];
+};
+export interface ExtractionScoreOptions {
+    additionalIssueCount?: number;
+    additionalReasons?: string[];
+}
+export declare function computeExtractionScore(component: RawComponentDefinition, options?: ExtractionScoreOptions): ExtractionScore;
+export declare function deriveNeedsReview(confidence: ExtractionConfidence): boolean;

package/dist/src/extract/{services/quality/helpers/scoring/collect-scoring-inputs.js → scoring.js}

@@ -1,6 +1,6 @@
 // Prop type strings that indicate the extractor couldn't resolve a concrete type
 const OPAQUE_TYPES = new Set(['any', 'unknown', 'object', 'Record<string, unknown>', 'Record<string, any>']);
-// Well-known prop names whose purpose is obvious without a description
+// Prop names that are non-obvious and benefit from a description
 const OBVIOUS_PROP_NAMES = new Set([
     'className',
     'style',
@@ -31,8 +31,9 @@ const OBVIOUS_PROP_NAMES = new Set([
     'aria-label',
     'aria-describedby',
 ]);
-/** Returns true when the union mixes 3+ distinct base primitive types (ignoring nullability). */
-export function isWidePrimitiveUnion(type) {
+// A union is "wide" if it mixes 3+ distinct base primitive types (ignoring nullability modifiers).
+// e.g. "string | number | boolean" → wide. "string | null | undefined" → NOT wide (just nullable string).
+function isWidePrimitiveUnion(type) {
     const parts = type.split('|').map((p) => p.trim());
     if (parts.length < 3)
         return false;
@@ -42,8 +43,8 @@ export function isWidePrimitiveUnion(type) {
     const nullabilityCount = parts.filter((p) => nullability.has(p)).length;
     return baseCount >= 3 || (baseCount >= 2 && nullabilityCount > 0 && baseCount + nullabilityCount >= 3);
 }
-/** Counts quality issues in the component and returns the count with labels. */
-export function countExtractionIssues(component, options = {}) {
+// Count the number of issues found for scoring
+function countIssues(component, options = {}) {
     let count = 0;
     const reasons = [];
     if (component.props.length === 0 && component.slots.length === 0) {
@@ -77,11 +78,13 @@ export function countExtractionIssues(component, options = {}) {
     }
     return { count, reasons: [...new Set(reasons)] };
 }
-/**
- * Maps issue count to a 1–5 confidence scale:
- *   0 → 5 (clean), 1 → 4, 2 → 3, 3 → 2, 4+ → 1
- */
-export function mapIssueCountToConfidence(count) {
+// Maps issue count to a 1–5 confidence scale:
+//   0 issues → 5 (clean)
+//   1 issue  → 4 (minor concern)
+//   2 issues → 3 (moderate concern)
+//   3 issues → 2 (significant concern)
+//   4+ issues → 1 (likely wrong)
+function issueCountToConfidence(count) {
     if (count === 0)
         return 5;
     if (count === 1)
@@ -92,3 +95,14 @@ export function mapIssueCountToConfidence(count) {
         return 2;
     return 1;
 }
+export function computeExtractionScore(component, options = {}) {
+    const { count, reasons } = countIssues(component, options);
+    return {
+        confidence: issueCountToConfidence(count),
+        reasons,
+    };
+}
+// Flag components scoring 2 or below for human review
+export function deriveNeedsReview(confidence) {
+    return confidence <= 2;
+}

package/dist/src/extract/slot-detection.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Slot detection utilities for ReactNode-typed props.
+ *
+ * Props whose type resolves to ReactNode/ReactElement/JSX.Element are treated
+ * as slots rather than plain props — unless their name is in the content-name
+ * exception list (label, title, description, etc.).
+ *
+ * Array ReactNode types (e.g. ReactNode[]) ALWAYS become slots, even if the
+ * prop name is in the exception list.
+ */
+/**
+ * Prop names that should remain as props even when typed as ReactNode.
+ * These are typically text-content names, not composable slots.
+ */
+export declare const CONTENT_NAME_EXCEPTIONS: Set<string>;
+/**
+ * Checks if a type string represents a ReactNode/ReactElement/JSX.Element type,
+ * including unions with null/undefined.
+ */
+export declare function isReactNodeType(typeText: string): boolean;
+/**
+ * Checks if a type string represents an array of ReactNode.
+ * Examples: ReactNode[], React.ReactNode[], Array<ReactNode>
+ */
+export declare function isArrayReactNodeType(typeText: string): boolean;
+/**
+ * Determines whether a prop should be converted to a slot based on its name and type.
+ *
+ * Rules:
+ * 1. If the type is not a ReactNode type → false
+ * 2. If the type is an array ReactNode → true (overrides exception list)
+ * 3. If the name is in the content-name exception list → false
+ * 4. Otherwise → true
+ */
+export declare function shouldBeSlot(propName: string, typeText: string): boolean;

package/dist/src/extract/slot-detection.js

@@ -0,0 +1,98 @@
+/**
+ * Slot detection utilities for ReactNode-typed props.
+ *
+ * Props whose type resolves to ReactNode/ReactElement/JSX.Element are treated
+ * as slots rather than plain props — unless their name is in the content-name
+ * exception list (label, title, description, etc.).
+ *
+ * Array ReactNode types (e.g. ReactNode[]) ALWAYS become slots, even if the
+ * prop name is in the exception list.
+ */
+/**
+ * Prop names that should remain as props even when typed as ReactNode.
+ * These are typically text-content names, not composable slots.
+ */
+export const CONTENT_NAME_EXCEPTIONS = new Set([
+    'label',
+    'title',
+    'description',
+    'text',
+    'caption',
+    'message',
+    'placeholder',
+    'tooltip',
+    'heading',
+    'subheading',
+    'body',
+    'summary',
+    'excerpt',
+]);
+const REACT_NODE_EXACT_PATTERNS = ['ReactNode', 'React.ReactNode', 'ReactElement', 'React.ReactElement', 'JSX.Element'];
+function normalizeReactNodeType(typeText) {
+    return typeText
+        .replace(/\s+/g, ' ')
+        .trim()
+        .split('|')
+        .map((part) => part.trim())
+        .filter((part) => part !== 'null' && part !== 'undefined')
+        .join(' | ');
+}
+/**
+ * Checks if a type string represents a ReactNode/ReactElement/JSX.Element type,
+ * including unions with null/undefined.
+ */
+export function isReactNodeType(typeText) {
+    const stripped = normalizeReactNodeType(typeText);
+    // Check exact match (after stripping null/undefined union members)
+    if (REACT_NODE_EXACT_PATTERNS.includes(stripped)) {
+        return true;
+    }
+    // Check array patterns
+    if (isArrayReactNodeType(typeText)) {
+        return true;
+    }
+    return false;
+}
+/**
+ * Checks if a type string represents an array of ReactNode.
+ * Examples: ReactNode[], React.ReactNode[], Array<ReactNode>
+ */
+export function isArrayReactNodeType(typeText) {
+    const stripped = normalizeReactNodeType(typeText);
+    // Pattern: ReactNode[] or React.ReactNode[] etc.
+    for (const pattern of REACT_NODE_EXACT_PATTERNS) {
+        if (stripped === `${pattern}[]`) {
+            return true;
+        }
+    }
+    // Pattern: Array<ReactNode> or Array<React.ReactNode> etc.
+    for (const pattern of REACT_NODE_EXACT_PATTERNS) {
+        if (stripped === `Array<${pattern}>`) {
+            return true;
+        }
+    }
+    return false;
+}
+/**
+ * Determines whether a prop should be converted to a slot based on its name and type.
+ *
+ * Rules:
+ * 1. If the type is not a ReactNode type → false
+ * 2. If the type is an array ReactNode → true (overrides exception list)
+ * 3. If the name is in the content-name exception list → false
+ * 4. Otherwise → true
+ */
+export function shouldBeSlot(propName, typeText) {
+    if (!isReactNodeType(typeText)) {
+        return false;
+    }
+    // Array ReactNode always becomes a slot, even for exception names
+    if (isArrayReactNodeType(typeText)) {
+        return true;
+    }
+    // Check exception list
+    if (CONTENT_NAME_EXCEPTIONS.has(propName)) {
+        return false;
+    }
+    return true;
+}

package/dist/src/extract/{services/quality/helpers/inspection/inspect-component-source.d.ts → source-inspection.d.ts}

@@ -1,9 +1,12 @@
-import type { RawComponentDefinition } from '../../../../types/component.js';
-import type { ComponentSourceInspection } from '../../../../types/source-inspection.js';
-export type { ComponentSourceInspection } from '../../../../types/source-inspection.js';
+import type { RawComponentDefinition } from '../types.js';
 export declare const HIGH_CONFIDENCE_DATA_FETCH_WRAPPER_REASON = "data-fetch-wrapper";
 export declare const POSSIBLE_DATA_FETCH_WRAPPER_REASON = "possible-data-fetch-wrapper";
 export declare const ZERO_SURFACE_RENDERED_UI_REASON = "zero-surface:rendered-ui";
+export interface ComponentSourceInspection {
+    wrapperConfidence: 0 | 1 | 2 | 3 | 4 | 5;
+    reviewReasons: string[];
+    keepDespiteZeroSurface: boolean;
+}
 export declare function inspectComponentSource(component: RawComponentDefinition): Promise<ComponentSourceInspection>;
 export declare function isDataWrapperReviewReason(reason: string): boolean;
 export declare function describeReviewReason(reason: string): string;

package/dist/src/extract/{services/quality/helpers/inspection/inspect-component-source.js → source-inspection.js}

@@ -1,8 +1,68 @@
 import { readFile } from 'node:fs/promises';
-import { DATA_WRAPPER_REASON_PREFIX, GENERATED_IMPORT_PATTERN, GENERATED_QUERY_HOOK_PATTERN, GQL_FILENAME_PATTERN, LOADING_NULL_GUARD_PATTERN, collectSiblingRendererImports, hasSiblingForwardRender, hasVisibleUiRender, collectInfraPropNames, mapScoreToWrapperConfidence, dedupeStrings, } from './detect-data-wrapper-patterns.js';
+import { parseImportedNames } from './parse-imported-names.js';
 export const HIGH_CONFIDENCE_DATA_FETCH_WRAPPER_REASON = 'data-fetch-wrapper';
 export const POSSIBLE_DATA_FETCH_WRAPPER_REASON = 'possible-data-fetch-wrapper';
 export const ZERO_SURFACE_RENDERED_UI_REASON = 'zero-surface:rendered-ui';
+const DATA_WRAPPER_REASON_PREFIX = 'data-wrapper:';
+const INFRA_PROP_NAMES = new Set(['id', 'locale', 'preview', 'slug', 'topic', 'previousComponent', '__typename']);
+const VISIBLE_UI_TAG_PATTERN = /<(?:[A-Z][A-Za-z0-9_.]*|div|span|section|main|article|header|footer|nav|aside|img|video|p|h[1-6]|ul|ol|li|button|input|textarea|select|form|label|table|tbody|thead|tr|td|th)\b/;
+const GENERATED_IMPORT_PATTERN = /from\s+['"][^'"]*__generated[^'"]*['"]/;
+const GENERATED_QUERY_HOOK_PATTERN = /\buse[A-Z][A-Za-z0-9]*(?:Lazy|Suspense)?Query\s*\(/;
+const GQL_FILENAME_PATTERN = /(?:-gql|-ggl)\.[cm]?[jt]sx?$/i;
+const LOADING_NULL_GUARD_PATTERN = /if\s*\([^)]*(?:isLoading|loading|!data|!\w+Collection|!\w+Item|!\w+)\s*[^)]*\)\s*return\s+null\b/;
+const IMPORT_PATTERN = /import\s+(?:type\s+)?(.+?)\s+from\s+['"]([^'"]+)['"]/g;
+function escapeRegExp(value) {
+    return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+function collectSiblingRendererImports(sourceText) {
+    const names = new Set();
+    for (const match of sourceText.matchAll(IMPORT_PATTERN)) {
+        const importClause = match[1]?.trim() ?? '';
+        const importPath = match[2]?.trim() ?? '';
+        if (!importPath.startsWith('./'))
+            continue;
+        if (importPath.includes('__generated'))
+            continue;
+        if (/-g(?:ql|gl)(?:$|\.)/i.test(importPath))
+            continue;
+        for (const name of parseImportedNames(importClause)) {
+            if (name)
+                names.add(name);
+        }
+    }
+    return [...names];
+}
+function hasSiblingForwardRender(sourceText, siblingImports) {
+    return siblingImports.some((name) => {
+        const renderPattern = new RegExp(`<${escapeRegExp(name)}\\b[\\s\\S]*?(?:/>|</${escapeRegExp(name)}>)`);
+        if (!renderPattern.test(sourceText))
+            return false;
+        const siblingSpreadPattern = new RegExp(`<${escapeRegExp(name)}\\b[^>]*\\{\\.\\.\\.(?!props\\b)[^}]+\\}`);
+        const propsPlusSiblingSpreadPattern = new RegExp(`<${escapeRegExp(name)}\\b[^>]*\\{\\.\\.\\.props\\}[^>]*\\{\\.\\.\\.(?!props\\b)[^}]+\\}`);
+        return siblingSpreadPattern.test(sourceText) || propsPlusSiblingSpreadPattern.test(sourceText);
+    });
+}
+function hasVisibleUiRender(sourceText) {
+    return /return\s*(?:\(|<)/.test(sourceText) && VISIBLE_UI_TAG_PATTERN.test(sourceText);
+}
+function infraPropNames(component) {
+    const props = component.props.map((prop) => prop.name);
+    return props.length > 0 && props.every((prop) => INFRA_PROP_NAMES.has(prop)) ? props : [];
+}
+function scoreToConfidence(score) {
+    if (score <= 0)
+        return 0;
+    if (score <= 2)
+        return 2;
+    if (score <= 4)
+        return 3;
+    if (score <= 6)
+        return 4;
+    return 5;
+}
+function dedupeReasons(reasons) {
+    return [...new Set(reasons)];
+}
 export async function inspectComponentSource(component) {
     let sourceText = '';
     try {
@@ -18,7 +78,7 @@ export async function inspectComponentSource(component) {
     const reviewReasons = [];
     let wrapperScore = 0;
     const hasGeneratedQueryHook = GENERATED_IMPORT_PATTERN.test(sourceText) && GENERATED_QUERY_HOOK_PATTERN.test(sourceText);
-    const infraProps = collectInfraPropNames(component);
+    const infraProps = infraPropNames(component);
     const siblingImports = collectSiblingRendererImports(sourceText);
     if (GQL_FILENAME_PATTERN.test(component.source)) {
         reviewReasons.push('data-wrapper:gql-filename');
@@ -50,7 +110,7 @@ export async function inspectComponentSource(component) {
         reviewReasons.push('data-wrapper:loading-null-guard');
         wrapperScore += 1;
     }
-    const wrapperConfidence = mapScoreToWrapperConfidence(wrapperScore);
+    const wrapperConfidence = scoreToConfidence(wrapperScore);
     if (wrapperConfidence >= 4) {
         reviewReasons.unshift(HIGH_CONFIDENCE_DATA_FETCH_WRAPPER_REASON);
     }
@@ -63,7 +123,7 @@ export async function inspectComponentSource(component) {
     }
     return {
         wrapperConfidence,
-        reviewReasons: dedupeStrings(reviewReasons),
+        reviewReasons: dedupeReasons(reviewReasons),
         keepDespiteZeroSurface,
     };
 }
@@ -99,5 +159,5 @@ export function describeReviewReason(reason) {
     }
 }
 export function describeReviewReasons(reasons) {
-    return dedupeStrings(reasons.map(describeReviewReason));
+    return dedupeReasons(reasons.map(describeReviewReason));
 }

package/dist/src/extract/{framework-adapters/shared/helpers/get-node-source-lines.d.ts → source-line-metadata.d.ts}

@@ -1,3 +1,3 @@
 import type { Node } from 'ts-morph';
-import type { RawPropDefinition } from '../../../types/component.js';
+import type { RawPropDefinition } from '../types.js';
 export declare function getSourceLineMetadata(declaration: Node | undefined): Pick<RawPropDefinition, 'sourceStartLine' | 'sourceEndLine'>;

package/dist/src/extract/{framework-adapters/stencil/extractor.d.ts → stencil.d.ts}

@@ -1,2 +1,2 @@
-import type { ComponentExtractionResult } from '../../types/component.js';
+import type { ComponentExtractionResult } from '../types.js';
 export declare function extractStencilComponents(filePaths: string[]): Promise<ComponentExtractionResult>;

package/dist/src/extract/stencil.js

@@ -0,0 +1,312 @@
+import { Project, Node, SyntaxKind } from 'ts-morph';
+import { getJsxTagNameNode, isIntrinsicJsxElement, kebabToPascal } from './tsx-shared.js';
+import { createSortedExtractionResult, extractProjectSourceFiles } from './file-extraction-workers.js';
+function isStencilFile(sourceFile) {
+    return sourceFile.getImportDeclarations().some((imp) => imp.getModuleSpecifierValue() === '@stencil/core');
+}
+function getComponentTag(classDecl) {
+    for (const decorator of classDecl.getDecorators()) {
+        if (decorator.getName() !== 'Component')
+            continue;
+        const args = decorator.getArguments();
+        if (args.length === 0)
+            continue;
+        const arg = args[0];
+        if (!Node.isObjectLiteralExpression(arg))
+            continue;
+        const tagProp = arg.getProperty('tag');
+        if (!tagProp || !Node.isPropertyAssignment(tagProp))
+            continue;
+        const initializer = tagProp.getInitializer();
+        if (!initializer || !Node.isStringLiteral(initializer))
+            continue;
+        return initializer.getLiteralValue();
+    }
+    return undefined;
+}
+function hasDecorator(node, decoratorName) {
+    if (!Node.isPropertyDeclaration(node))
+        return false;
+    return node.getDecorators().some((d) => d.getName() === decoratorName);
+}
+function extractAllowedValues(typeText) {
+    // Match inline string literal unions: 'a' | 'b' | 'c'
+    const literalPattern = /^'[^']*'(?:\s*\|\s*'[^']*')+$/;
+    if (!literalPattern.test(typeText.trim()))
+        return undefined;
+    const values = typeText
+        .split('|')
+        .map((v) => v.trim().replace(/^'|'$/g, ''))
+        .filter(Boolean)
+        .sort();
+    return values.length >= 2 ? values : undefined;
+}
+function collectIntrinsicDomAttributeProps(classDecl, propNames) {
+    const domAttributeProps = new Set();
+    const renderMethod = classDecl.getMethod('render');
+    if (!renderMethod)
+        return domAttributeProps;
+    for (const attribute of renderMethod.getDescendantsOfKind(SyntaxKind.JsxAttribute)) {
+        const tagName = getJsxTagNameNode(attribute)?.getText();
+        const attributeName = attribute.getNameNode().getText();
+        if (!tagName || !propNames.has(attributeName) || !isIntrinsicJsxElement(tagName)) {
+            continue;
+        }
+        const initializer = attribute.getInitializer();
+        if (!initializer || !Node.isJsxExpression(initializer))
+            continue;
+        const expression = initializer.getExpression();
+        if (!expression || !Node.isPropertyAccessExpression(expression))
+            continue;
+        if (!Node.isThisExpression(expression.getExpression()))
+            continue;
+        if (expression.getName() !== attributeName)
+            continue;
+        domAttributeProps.add(attributeName);
+    }
+    return domAttributeProps;
+}
+function extractProps(classDecl) {
+    const props = [];
+    const propNames = new Set(classDecl
+        .getProperties()
+        .filter((property) => hasDecorator(property, 'Prop'))
+        .map((property) => property.getName()));
+    const intrinsicDomAttributeProps = collectIntrinsicDomAttributeProps(classDecl, propNames);
+    for (const property of classDecl.getProperties()) {
+        if (!hasDecorator(property, 'Prop'))
+            continue;
+        const name = property.getName();
+        const typeNode = property.getTypeNode();
+        const typeText = typeNode ? typeNode.getText() : 'unknown';
+        const hasQuestionToken = property.hasQuestionToken();
+        const hasExclamation = property.hasExclamationToken();
+        const initializer = property.getInitializer();
+        let defaultValue;
+        if (initializer) {
+            if (Node.isStringLiteral(initializer)) {
+                defaultValue = initializer.getLiteralValue();
+            }
+            else {
+                defaultValue = initializer.getText();
+            }
+        }
+        const isRequired = hasExclamation || (!hasQuestionToken && !initializer);
+        // JSDoc description
+        const jsDocs = property.getJsDocs();
+        let description;
+        let isDeprecated = false;
+        if (jsDocs.length > 0) {
+            const jsDoc = jsDocs[0];
+            description = jsDoc.getDescription().trim() || undefined;
+            for (const tag of jsDoc.getTags()) {
+                if (tag.getTagName() === 'deprecated') {
+                    isDeprecated = true;
+                    // The deprecated tag may carry a message (e.g. "@deprecated Use size instead.")
+                    const tagComment = tag.getCommentText()?.trim();
+                    if (tagComment && !description) {
+                        description = tagComment;
+                    }
+                }
+            }
+        }
+        if (isDeprecated && description) {
+            description = `[DEPRECATED] ${description}`;
+        }
+        else if (isDeprecated) {
+            description = '[DEPRECATED]';
+        }
+        const allowedValues = extractAllowedValues(typeText);
+        props.push({
+            name,
+            type: typeText,
+            required: isRequired,
+            ...(defaultValue !== undefined && { defaultValue }),
+            ...(description && { description }),
+            ...(allowedValues && { allowedValues }),
+            ...(intrinsicDomAttributeProps.has(name) && { domAttribute: true }),
+            sourceStartLine: property.getStartLineNumber(),
+            sourceEndLine: property.getEndLineNumber(),
+        });
+    }
+    return props.sort((a, b) => a.name.localeCompare(b.name));
+}
+function normalizeSlotName(name) {
+    const normalizedName = name && name.length > 0 ? name : 'default';
+    return {
+        name: normalizedName,
+        isDefault: normalizedName === 'default',
+    };
+}
+function extractSlots(classDecl, warnings, componentName) {
+    const slots = new Map();
+    const upsertSlot = (slot) => {
+        const existing = slots.get(slot.name);
+        if (!existing) {
+            slots.set(slot.name, slot);
+            return;
+        }
+        slots.set(slot.name, {
+            ...existing,
+            ...slot,
+            description: existing.description ?? slot.description,
+        });
+    };
+    const jsDocs = classDecl.getJsDocs();
+    for (const jsDoc of jsDocs) {
+        for (const tag of jsDoc.getTags()) {
+            if (tag.getTagName() !== 'slot')
+                continue;
+            const comment = tag.getCommentText()?.trim();
+            if (!comment)
+                continue;
+            if (comment.startsWith('{')) {
+                try {
+                    const parsed = JSON.parse(comment);
+                    const slot = normalizeSlotName(parsed.name);
+                    let description = parsed.description || undefined;
+                    if (parsed.isDeprecated && description) {
+                        description = `[DEPRECATED] ${description}`;
+                    }
+                    else if (parsed.isDeprecated) {
+                        description = '[DEPRECATED]';
+                    }
+                    upsertSlot({
+                        ...slot,
+                        ...(description && { description }),
+                    });
+                    continue;
+                }
+                catch {
+                    warnings.push(`Failed to parse @slot JSDoc in ${componentName}: invalid JSON "${comment}"`);
+                    continue;
+                }
+            }
+            const match = comment.match(/^(?:(\S+)\s*-\s*)?(.*)$/s);
+            if (!match)
+                continue;
+            const [, rawName, rawDescription] = match;
+            const slot = normalizeSlotName(rawName);
+            const description = rawDescription.trim() || undefined;
+            upsertSlot({
+                ...slot,
+                ...(description && { description }),
+            });
+        }
+    }
+    for (const method of classDecl.getMethods()) {
+        method.forEachDescendant((node) => {
+            if (!Node.isJsxSelfClosingElement(node) && !Node.isJsxElement(node))
+                return;
+            const openingElement = Node.isJsxElement(node) ? node.getOpeningElement() : node;
+            const tagName = openingElement.getTagNameNode().getText();
+            const slotAttribute = openingElement
+                .getAttributes()
+                .find((attribute) => Node.isJsxAttribute(attribute) && attribute.getNameNode().getText() === 'slot');
+            if (tagName === 'slot') {
+                const nameAttribute = openingElement
+                    .getAttributes()
+                    .find((attribute) => Node.isJsxAttribute(attribute) && attribute.getNameNode().getText() === 'name');
+                const initializer = Node.isJsxAttribute(nameAttribute) ? nameAttribute.getInitializer() : undefined;
+                const name = initializer && Node.isStringLiteral(initializer)
+                    ? initializer.getLiteralValue()
+                    : initializer && Node.isJsxExpression(initializer)
+                        ? (initializer.getExpression()?.getText() ?? '')
+                        : '';
+                upsertSlot({
+                    ...normalizeSlotName(name),
+                });
+                return;
+            }
+            if (!Node.isJsxAttribute(slotAttribute))
+                return;
+            const initializer = slotAttribute.getInitializer();
+            if (!initializer || !Node.isStringLiteral(initializer))
+                return;
+            const name = initializer.getLiteralValue();
+            if (!name)
+                return;
+            upsertSlot({
+                name,
+                isDefault: false,
+            });
+        });
+    }
+    return [...slots.values()].sort((a, b) => a.name.localeCompare(b.name));
+}
+function detectEvents(classDecl) {
+    const eventNames = [];
+    for (const property of classDecl.getProperties()) {
+        if (!hasDecorator(property, 'Event'))
+            continue;
+        eventNames.push(property.getName());
+    }
+    return eventNames.sort();
+}
+function extractFromSourceFile(sourceFile, warnings) {
+    const components = [];
+    for (const classDecl of sourceFile.getClasses()) {
+        const tag = getComponentTag(classDecl);
+        if (!tag)
+            continue;
+        const name = kebabToPascal(tag);
+        const props = extractProps(classDecl);
+        const slots = extractSlots(classDecl, warnings, name);
+        const eventNames = detectEvents(classDecl);
+        if (eventNames.length > 0) {
+            warnings.push(`Component ${name} has ${eventNames.length} events not captured: ${eventNames.join(', ')}`);
+        }
+        components.push({
+            name,
+            source: sourceFile.getFilePath(),
+            sourcePath: sourceFile.getFilePath(),
+            framework: 'stencil',
+            props,
+            slots,
+        });
+    }
+    return components;
+}
+function detectFunctionalComponents(sourceFile, warnings) {
+    for (const [exportName, declarations] of sourceFile.getExportedDeclarations()) {
+        for (const decl of declarations) {
+            if (!Node.isVariableDeclaration(decl))
+                continue;
+            const typeNode = decl.getTypeNode();
+            if (!typeNode)
+                continue;
+            const typeText = typeNode.getText();
+            if (!typeText.startsWith('FunctionalComponent'))
+                continue;
+            warnings.push(`Stencil FunctionalComponent detected but not extracted: ${exportName} in ${sourceFile.getFilePath()}`);
+        }
+    }
+}
+export async function extractStencilComponents(filePaths) {
+    const tsxFiles = filePaths.filter((f) => /\.[jt]sx$/.test(f));
+    if (tsxFiles.length === 0) {
+        return { components: [], warnings: [] };
+    }
+    const project = new Project({
+        compilerOptions: {
+            jsx: 1, // JsxEmit.Preserve
+            target: 99, // ScriptTarget.ESNext
+            module: 99, // ModuleKind.ESNext
+            moduleResolution: 100, // ModuleResolutionKind.Bundler
+            skipLibCheck: true,
+            allowJs: true,
+        },
+        skipAddingFilesFromTsConfig: true,
+    });
+    for (const filePath of tsxFiles) {
+        project.addSourceFileAtPath(filePath);
+    }
+    const { items: components, warnings } = extractProjectSourceFiles(project, (sourceFile, sourceWarnings) => {
+        if (!isStencilFile(sourceFile))
+            return [];
+        const extracted = extractFromSourceFile(sourceFile, sourceWarnings);
+        detectFunctionalComponents(sourceFile, sourceWarnings);
+        return extracted;
+    });
+    return createSortedExtractionResult(components, warnings);
+}