Skip to main content
Glama

Visa Design System MCP Server

by MarySuneela

search-components

Use this tool to search for design components within the Visa Design System by name, description, or other criteria, enabling quick access to specifications and usage guidelines.

Instructions

Search components by name, description, or other criteria

Input Schema

NameRequiredDescriptionDefault
queryYesSearch query for components

Input Schema (JSON Schema)

{ "properties": { "query": { "description": "Search query for components", "type": "string" } }, "required": [ "query" ], "type": "object" }

Implementation Reference

  • Registration of the 'search-components' tool in getToolDefinitions(). Includes name, description, and input schema.
    { name: 'search-components', description: 'Search components by name, description, or other criteria', inputSchema: { type: 'object', properties: { query: { type: 'string', description: 'Search query for components' } }, required: ['query'] } },
  • MCP server handler for 'search-components': validates query param, calls ComponentService.searchComponents, formats response as JSON.
    private async handleSearchComponents(args: Record<string, any>): Promise<CallToolResult> { const { query } = args; if (!query || typeof query !== 'string') { throw new McpError( ErrorCode.InvalidParams, 'Query parameter is required and must be a string' ); } const components = await this.componentService.searchComponents(query); return { content: [ { type: 'text', text: JSON.stringify({ components, count: components.length, query }, null, 2) } ] }; }
  • Core implementation: searches components by filtering cached data where query matches (case-insensitive) in name, description, category, guidelines, or props.
    async searchComponents(query: string): Promise<Component[]> { if (!query || typeof query !== 'string') { throw this.createError('INVALID_QUERY', 'Search query must be a non-empty string'); } const cachedData = this.dataManager.getCachedData(); if (!cachedData) { throw this.createError('NO_DATA', 'No component data available'); } const searchTerm = query.toLowerCase(); return cachedData.components.filter(component => { // Search in name if (component.name.toLowerCase().includes(searchTerm)) { return true; } // Search in description if (component.description.toLowerCase().includes(searchTerm)) { return true; } // Search in category if (component.category.toLowerCase().includes(searchTerm)) { return true; } // Search in guidelines if (component.guidelines.some(guideline => guideline.toLowerCase().includes(searchTerm) )) { return true; } // Search in prop names and descriptions if (component.props.some(prop => prop.name.toLowerCase().includes(searchTerm) || prop.description.toLowerCase().includes(searchTerm) )) { return true; } return false; }); }
  • Input schema definition: requires 'query' string parameter.
    inputSchema: { type: 'object', properties: { query: { type: 'string', description: 'Search query for components' } }, required: ['query'] }

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/MarySuneela/mcp-vpds'

If you have feedback or need assistance with the MCP directory API, please join our Discord server