get-component-details
Retrieve detailed specifications, usage guidelines, and design tokens for a specific component in the Visa Design System to ensure consistency and accuracy in product design.
Instructions
Get detailed information about a specific component
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| name | Yes | Component name |
Implementation Reference
- src/mcp-server.ts:188-201 (registration)Registration of the 'get-component-details' tool including name, description, and input schema.{ name: 'get-component-details', description: 'Get detailed information about a specific component', inputSchema: { type: 'object', properties: { name: { type: 'string', description: 'Component name' } }, required: ['name'] } },
- src/mcp-server.ts:461-481 (handler)The main MCP tool handler function that validates input, delegates to ComponentService.getComponent, and formats response as JSON.private async handleGetComponentDetails(args: Record<string, any>): Promise<CallToolResult> { const { name } = args; if (!name || typeof name !== 'string') { throw new McpError( ErrorCode.InvalidParams, 'Component name is required and must be a string' ); } const component = await this.componentService.getComponent(name); return { content: [ { type: 'text', text: JSON.stringify(component, null, 2) } ] }; }
- Core helper function implementing component lookup by name from cached data with full validation and error handling.async getComponent(name: string): Promise<Component> { if (!name || typeof name !== 'string') { throw this.createError('INVALID_NAME', 'Component name must be a non-empty string'); } const cachedData = this.dataManager.getCachedData(); if (!cachedData) { throw this.createError('NO_DATA', 'No component data available'); } const component = cachedData.components.find( comp => comp.name.toLowerCase() === name.toLowerCase() ); if (!component) { const availableComponents = cachedData.components.map(comp => comp.name); throw this.createError('COMPONENT_NOT_FOUND', `Component "${name}" not found`, [ `Available components: ${availableComponents.join(', ')}`, 'Check component name spelling' ]); } return component; }