jsc-typescript-ast-mcp 1.0.11 → 1.1.1

package/README.md

@@ -96,6 +96,7 @@ Analyze React component structures in your codebase.
 - **Input**:
   - `entryFilePath`: Path to the entry file
   - `maxDepth`: Maximum depth of the component tree (default: 3)
+  - `data-id` (optional): Attribute name to capture into `TreeNode.dataId` (example: `data-attribute-id`)
 - **Output**: JSON representation of the component tree structure
 
 ## License

package/dist/ts-morph/componentTree.js

@@ -11,9 +11,13 @@ export const registerComponentTreeTool = (server) => {
                 .number()
                 .default(3)
                 .describe('Maximum depth of the component tree (default: 3)'),
+            'data-id': z
+                .string()
+                .optional()
+                .describe('Optional attribute name to capture as TreeNode.dataId (example: data-attribute-id)'),
         },
-    }, async ({ entryFilePath, maxDepth }) => {
-        const tree = getComponentTree(entryFilePath, maxDepth);
+    }, async ({ entryFilePath, maxDepth, ['data-id']: dataIdAttribute }) => {
+        const tree = getComponentTree(entryFilePath, maxDepth, dataIdAttribute);
         return {
             content: [
                 {
@@ -24,7 +28,7 @@ export const registerComponentTreeTool = (server) => {
         };
     });
 };
-const getComponentTree = (entryFilePath, maxDepth) => {
+const getComponentTree = (entryFilePath, maxDepth, dataIdAttribute) => {
     const project = createProject();
     const sourceFile = project.getSourceFile(entryFilePath);
     if (!sourceFile) {
@@ -33,5 +37,6 @@ const getComponentTree = (entryFilePath, maxDepth) => {
     const component = getComponent(sourceFile);
     return analyzeComponent(component, project, {
         maxDepth,
+        dataIdAttribute,
     }, 0);
 };

package/dist/ts-morph/utils/analyzeComponent.js

@@ -7,6 +7,7 @@ export const analyzeComponent = (node, project, options, currentDepth) => {
         name,
         type: 'component',
         children: [],
+        filePath: node.getSourceFile().getFilePath(),
     };
     if (currentDepth >= options.maxDepth) {
         return root;

package/dist/ts-morph/utils/component.js

@@ -1,16 +1,52 @@
-import { SyntaxKind } from 'ts-morph';
-import { getComponentName } from './nameHelper.js';
+import { Node, SyntaxKind } from 'ts-morph';
+const isComponentVariableDeclaration = (node) => {
+    if (!Node.isVariableDeclaration(node)) {
+        return false;
+    }
+    const initializer = node.getInitializer();
+    if (!initializer) {
+        return false;
+    }
+    return (initializer.getKind() === SyntaxKind.ArrowFunction ||
+        initializer.getKind() === SyntaxKind.FunctionExpression);
+};
+const isComponentDeclaration = (node) => {
+    if (Node.isFunctionDeclaration(node)) {
+        return true;
+    }
+    return isComponentVariableDeclaration(node);
+};
+const getFirstExportedComponent = (sourceFile) => {
+    const exportedDeclarations = sourceFile.getExportedDeclarations();
+    for (const declarations of exportedDeclarations.values()) {
+        const componentDeclaration = declarations.find(isComponentDeclaration);
+        if (componentDeclaration) {
+            return componentDeclaration;
+        }
+    }
+    return undefined;
+};
 export const getComponent = (sourceFile) => {
-    const component = sourceFile.getDefaultExportSymbol()?.getDeclarations()?.[0];
-    if (!component) {
-        throw new Error(`Component not found in ${sourceFile.getFilePath()}`);
-    }
-    const componentName = getComponentName(component);
-    if (componentName !== 'AnonymousComponent')
-        return component;
-    const components = sourceFile.getVariableDeclarations().filter((v) => {
-        const initializer = v.getInitializer();
-        return initializer?.getKind() === SyntaxKind.ArrowFunction;
-    });
-    return components[0];
+    const defaultExportDeclaration = sourceFile
+        .getDefaultExportSymbol()
+        ?.getDeclarations()
+        ?.find(isComponentDeclaration);
+    if (defaultExportDeclaration) {
+        return defaultExportDeclaration;
+    }
+    const firstExportedComponent = getFirstExportedComponent(sourceFile);
+    if (firstExportedComponent) {
+        return firstExportedComponent;
+    }
+    const localVariableComponent = sourceFile
+        .getVariableDeclarations()
+        .find(isComponentVariableDeclaration);
+    if (localVariableComponent) {
+        return localVariableComponent;
+    }
+    const localFunctionComponent = sourceFile.getFunctions()[0];
+    if (localFunctionComponent) {
+        return localFunctionComponent;
+    }
+    throw new Error(`Component not found in ${sourceFile.getFilePath()}`);
 };

package/dist/ts-morph/utils/extractJsx.js

@@ -2,8 +2,9 @@ import { Node, SyntaxKind, } from 'ts-morph';
 import { analyzeComponent } from './analyzeComponent.js';
 import { getComponent } from './component.js';
 import { getTagName } from './nameHelper.js';
+import { extractPropsFromNode } from './props.js';
 import { handleTernary } from './ternary.js';
-const extractFromExpression = (expression, project, options, depth) => {
+export const extractFromExpression = (expression, project, options, depth) => {
     if (Node.isConditionalExpression(expression)) {
         return handleTernary(expression, project, options, depth);
     }
@@ -15,7 +16,7 @@ const extractFromExpression = (expression, project, options, depth) => {
     }
     return extractJSX(expression, project, options, depth);
 };
-const handleLogicalAnd = (expression, project, options, depth) => {
+export const handleLogicalAnd = (expression, project, options, depth) => {
     if (expression.getOperatorToken().getText() !== '&&') {
         return [];
     }
@@ -90,20 +91,65 @@ const resolveComponentFile = (node) => {
         const defaultImport = imp.getDefaultImport();
         if (defaultImport?.getText() === tagName) {
             const file = imp.getModuleSpecifierSourceFile();
-            const component = getComponent(file);
-            return component ?? null;
+            if (!file || file.getFilePath().includes('/node_modules/')) {
+                return null;
+            }
+            try {
+                const component = getComponent(file);
+                return component ?? null;
+            }
+            catch {
+                return null;
+            }
         }
         for (const n of named) {
             if (n.getName() === tagName) {
                 const file = imp.getModuleSpecifierSourceFile();
-                const component = getComponent(file);
-                return component ?? null;
+                if (!file || file.getFilePath().includes('/node_modules/')) {
+                    return null;
+                }
+                try {
+                    const component = getComponent(file);
+                    return component ?? null;
+                }
+                catch {
+                    return null;
+                }
             }
         }
     }
     return null;
 };
-function buildNodeFromJSX(node, project, options, depth) {
+const resolveLocalComponentFilePath = (node) => {
+    const tagName = getTagName(node);
+    const sourceFile = node.getSourceFile();
+    for (const imp of sourceFile.getImportDeclarations()) {
+        const matchesDefaultImport = imp.getDefaultImport()?.getText() === tagName;
+        const matchesNamedImport = imp
+            .getNamedImports()
+            .some((namedImport) => namedImport.getName() === tagName);
+        if (!matchesDefaultImport && !matchesNamedImport) {
+            continue;
+        }
+        const moduleSpecifier = imp.getModuleSpecifierValue();
+        const isLocalImport = moduleSpecifier.startsWith('.') || moduleSpecifier.startsWith('/');
+        if (!isLocalImport) {
+            return undefined;
+        }
+        const importedSourceFile = imp.getModuleSpecifierSourceFile();
+        if (!importedSourceFile) {
+            return undefined;
+        }
+        const importedFilePath = importedSourceFile.getFilePath();
+        if (importedFilePath.includes('/node_modules/')) {
+            return undefined;
+        }
+        return importedFilePath;
+    }
+    // If there is no matching import, treat it as a component from the current local source file.
+    return sourceFile.getFilePath();
+};
+const buildNodeFromJSX = (node, project, options, depth) => {
     const tagName = getTagName(node);
     const isHtml = tagName[0] === tagName[0].toLowerCase();
     const treeNode = {
@@ -111,6 +157,22 @@ function buildNodeFromJSX(node, project, options, depth) {
         type: isHtml ? 'html' : 'component',
         children: [],
     };
+    if (!isHtml) {
+        const localComponentFilePath = resolveLocalComponentFilePath(node);
+        if (localComponentFilePath) {
+            treeNode.filePath = localComponentFilePath;
+        }
+    }
+    const props = extractPropsFromNode(node);
+    if (props) {
+        treeNode.props = props;
+        if (options.dataIdAttribute && options.dataIdAttribute in props) {
+            const dataIdValue = props[options.dataIdAttribute];
+            if (dataIdValue !== undefined && dataIdValue !== null) {
+                treeNode.dataId = String(dataIdValue);
+            }
+        }
+    }
     // Recurse into children
     if (Node.isJsxElement(node)) {
         const children = node.getJsxChildren();
@@ -140,12 +202,13 @@ function buildNodeFromJSX(node, project, options, depth) {
     if (!isHtml && depth < options.maxDepth) {
         const resolved = resolveComponentFile(node);
         if (resolved) {
+            treeNode.filePath = resolved.getSourceFile().getFilePath();
             const subTree = analyzeComponent(resolved, project, options, depth);
             treeNode.children.push(...subTree.children);
         }
     }
     return treeNode;
-}
+};
 export const findReturnedJSX = (node) => {
     const returnStmt = node.getDescendantsOfKind(SyntaxKind.ReturnStatement)[0];
     if (returnStmt) {

package/dist/ts-morph/utils/props.js

@@ -0,0 +1,46 @@
+import { Node, } from 'ts-morph';
+const extractPropValue = (attribute) => {
+    const initializer = attribute.getInitializer();
+    if (!initializer) {
+        return true;
+    }
+    if (Node.isStringLiteral(initializer)) {
+        return initializer.getLiteralText();
+    }
+    if (Node.isJsxExpression(initializer)) {
+        const expression = initializer.getExpression();
+        if (!expression) {
+            return true;
+        }
+        return expression.getText();
+    }
+    return initializer.getText();
+};
+const addSpreadProps = (props, spreadAttribute) => {
+    const expression = spreadAttribute.getExpression();
+    const expressionText = expression.getText();
+    // Keep spread attributes as references so callers can resolve them later if needed.
+    props[`...${expressionText}`] = expressionText;
+};
+export const extractPropsFromNode = (node) => {
+    const attributes = Node.isJsxElement(node)
+        ? node.getOpeningElement().getAttributes()
+        : node.getAttributes();
+    if (attributes.length === 0) {
+        return undefined;
+    }
+    const props = {};
+    for (const attribute of attributes) {
+        if (Node.isJsxAttribute(attribute)) {
+            props[attribute.getNameNode().getText()] = extractPropValue(attribute);
+            continue;
+        }
+        if (Node.isJsxSpreadAttribute(attribute)) {
+            addSpreadProps(props, attribute);
+        }
+    }
+    if (Object.keys(props).length === 0) {
+        return undefined;
+    }
+    return props;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jsc-typescript-ast-mcp",
-  "version": "1.0.11",
+  "version": "1.1.1",
   "mcpName": "io.github.jscoobyced/jsc-typescript-ast-mcp",
   "description": "A Model Context Protocol (MCP) server that provides an abstract syntax tree (AST) representation of TypeScript code using the ts-morph library. It allows clients to analyze and manipulate TypeScript code structures, making it easier for AI models to understand and work with TypeScript projects. You can create a JSON representation of your React components, and use it for various purposes such as documentation, code analysis, or even generating new code based on existing components.",
   "main": "dist/index.js",
@@ -21,6 +21,7 @@
   "scripts": {
     "format": "prettier --write .",
     "build": "tsc",
+    "lint": "eslint . --ext .ts",
     "test:mcp": "npx @modelcontextprotocol/inspector node dist/index.js"
   },
   "bin": {