Extract Get Component Info Tool (#23)

* extract

# Conflicts:
#	src/index.ts

* Remove unneeded import

Author: dominicmacaulay

src/index.ts

@@ -13,7 +13,6 @@ import type { ListPromptsRequestSchema, GetPromptRequestSchema } from "@modelcon
 import { z } from 'zod';
 import {
   designTokens,
-  components,
   documentation,
   getComponentTokenDependencies,
 } from './optics-data.js';
@@ -45,6 +44,7 @@ import GetTokenTool from './tools/get-token-tool.js';
 import GetTokenUsageStatsTool from './tools/get-token-usage-stats-tool.js';
 import SearchTokensTool from './tools/search-tokens-tool.js';
 import ListComponentsTool from './tools/list-components-tool.js'
+import GetComponentInfoTool from './tools/get-component-info-tool.js';
 
 /**
  * Create and configure the MCP server
@@ -186,7 +186,7 @@ prompts.forEach((prompt) => {
 // get_token_usage_stats ✅
 // search_tokens ✅
 // list_components ✅
-// get_component_info
+// get_component_info ✅
 // get_component_tokens
 // search_documentation
 
@@ -195,6 +195,7 @@ const tools = [
   new GetTokenUsageStatsTool(),
   new SearchTokensTool(),
   new ListComponentsTool(),
+  new GetComponentInfoTool(),
 ]
 
 tools.forEach((tool) => {
@@ -220,47 +221,6 @@ tools.forEach((tool) => {
   )
 })
 
-/**
- * Tool: Get Component Info
- */
-server.registerTool(
-  'get_component_info',
-  {
-    title: 'Get Component Info',
-    description: 'Get detailed information about a component including its design token dependencies',
-    inputSchema: {
-      componentName: z.string().describe('The name of the component (e.g., "Button", "Card", "Input")'),
-    },
-  },
-  async ({ componentName }) => {
-    const component = components.find(
-      (c) => c.name.toLowerCase() === componentName.toLowerCase()
-    );
-
-    if (!component) {
-      return {
-        content: [
-          {
-            type: 'text',
-            text: `Component not found: ${componentName}\n\nAvailable components: ${components
-              .map((c) => c.name)
-              .join(', ')}`,
-          },
-        ],
-      };
-    }
-
-    return {
-      content: [
-        {
-          type: 'text',
-          text: JSON.stringify(component, null, 2),
-        },
-      ],
-    };
-  }
-);
-
 /**
  * Tool: Get Component Tokens
  */

src/tools/get-component-info-tool.ts

@@ -0,0 +1,35 @@
+import { z } from 'zod'
+
+import Tool, { type ToolInputSchema } from './tool.js'
+import { components } from '../optics-data.js'
+
+class GetComponentInfoTool extends Tool {
+  name = 'get_component_info'
+  title = 'Get Component Info'
+  description = 'Get detailed information about a component including its design token dependencies'
+
+  inputSchema = {
+    componentName: z
+      .string()
+      .describe('The name of the component (e.g., "Button", "Card", "Input")')
+  }
+
+  async handler(args: ToolInputSchema): Promise<string> {
+    const component = components.find(
+      (c) => c.name.toLowerCase() === args.componentName.toLowerCase()
+    )
+
+    let value = ''
+
+    if (!component) {
+      const availableComponents = components.map((c) => c.name).join(', ')
+      value = `Component not found: ${args.componentName}\n\nAvailable components: ${availableComponents}`
+    } else {
+      value = JSON.stringify(component, null, 2)
+    }
+
+    return value
+  }
+}
+
+export default GetComponentInfoTool