Skip to main content
Glama

get_web_component

Retrieve accessibility criteria for web components including WCAG mappings, acceptance criteria, and implementation guidelines to ensure compliance with accessibility standards.

Instructions

Get detailed accessibility criteria for a specific web component. Returns acceptance criteria, WCAG mappings, code examples, and implementation guidelines.

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
componentYesComponent name (e.g., "button", "checkbox", "text-input")
include_code_examplesNoInclude code examples in response (default: true)

Implementation Reference

  • Primary handler function that executes the get_web_component tool logic. Retrieves web component accessibility data via contentLoader and includes comprehensive error handling with component suggestions.
    async function handleGetWebComponent(args: any) { try { const componentData = await contentLoader.getComponent('web', args.component); return { content: [ { type: 'text', text: JSON.stringify(componentData, null, 2), }, ], }; } catch (error: any) { const suggestions = contentLoader.getSimilarComponents('web', args.component); return { content: [ { type: 'text', text: JSON.stringify( { error: 'Component not found', component: args.component, suggestions, }, null, 2 ), }, ], isError: true, }; } }
  • Tool schema definition including name, description, and input schema with required 'component' parameter and optional code examples flag.
    { name: 'get_web_component', description: 'Get detailed accessibility criteria for a specific web component. Returns acceptance criteria, WCAG mappings, code examples, and implementation guidelines.', inputSchema: { type: 'object', properties: { component: { type: 'string', description: 'Component name (e.g., "button", "checkbox", "text-input")', }, include_code_examples: { type: 'boolean', description: 'Include code examples in response (default: true)', default: true, }, }, required: ['component'], }, },
  • src/index.ts:36-40 (registration)
    Registration of all tools, including get_web_component, via the ListToolsRequestSchema handler that returns TOOL_DEFINITIONS.
    server.setRequestHandler(ListToolsRequestSchema, async () => { return { tools: TOOL_DEFINITIONS, }; });
  • Alternative inline handler for get_web_component in the Netlify HTTP server implementation.
    case 'get_web_component': { const data = await contentLoader.getComponent('web', args.component); return { content: [{ type: 'text', text: JSON.stringify(data, null, 2) }] }; }
  • Registration of tools in Netlify function using shared TOOL_DEFINITIONS for list tools endpoint.
    const tools = TOOL_DEFINITIONS;

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/joe-watkins/magentaa11y-mcp-remote'

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