get-design-tokens
Retrieve design tokens from Visa's Design System with optional filtering by category (color, typography, spacing, elevation, motion) or deprecated status.
Instructions
Get design tokens with optional category filtering
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| category | No | Filter tokens by category (color, typography, spacing, elevation, motion) | |
| deprecated | No | Filter by deprecated status (true for deprecated, false for active) |
Implementation Reference
- src/mcp-server.ts:116-132 (registration)Registration of the 'get-design-tokens' tool including name, description, and input schema definition.
name: 'get-design-tokens', description: 'Get design tokens with optional category filtering', inputSchema: { type: 'object', properties: { category: { type: 'string', description: 'Filter tokens by category (color, typography, spacing, elevation, motion)', enum: ['color', 'typography', 'spacing', 'elevation', 'motion'] }, deprecated: { type: 'boolean', description: 'Filter by deprecated status (true for deprecated, false for active)' } } } }, - src/mcp-server.ts:348-363 (handler)MCP tool handler for 'get-design-tokens' that invokes the design token service and returns formatted JSON response.
private async handleGetDesignTokens(args: Record<string, any>): Promise<CallToolResult> { const tokens = await this.designTokenService.getTokens(args); return { content: [ { type: 'text', text: JSON.stringify({ tokens, count: tokens.length, category: args.category || 'all' }, null, 2) } ] }; } - Core getTokens method in DesignTokenService that retrieves design tokens from cache and applies optional filters.
async getTokens(options?: DesignTokenSearchOptions): Promise<DesignToken[]> { const cachedData = this.dataManager.getCachedData(); if (!cachedData) { throw this.createError('NO_DATA', 'No design token data available', [ 'Ensure data files are loaded', 'Check data directory configuration' ]); } let tokens = cachedData.designTokens; // Apply filters if provided if (options) { tokens = this.filterTokens(tokens, options); } return tokens; } - Helper method filterTokens used to apply category, deprecated status, and usage filters to design tokens.
private filterTokens(tokens: DesignToken[], options: DesignTokenSearchOptions): DesignToken[] { return tokens.filter(token => { // Filter by category if (options.category && token.category !== options.category) { return false; } // Filter by deprecated status if (options.deprecated !== undefined) { const isDeprecated = token.deprecated === true; if (options.deprecated !== isDeprecated) { return false; } } // Filter by usage if (options.hasUsage && options.hasUsage.length > 0) { const tokenUsage = token.usage || []; const hasAllUsage = options.hasUsage.every(usage => tokenUsage.some(tokenUsageItem => tokenUsageItem.toLowerCase().includes(usage.toLowerCase()) ) ); if (!hasAllUsage) { return false; } } return true; }); } - src/mcp-server.ts:290-291 (registration)Tool call routing in handleToolCall switch statement that directs to the specific handler.
case 'get-design-tokens': return await this.handleGetDesignTokens(args);