get_component
Retrieve source code for a specific shadcn/ui v4 component by specifying its name, enabling integration and customization in your project.
Instructions
Get the source code for a specific shadcn/ui v4 component
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| componentName | Yes | Name of the shadcn/ui component (e.g., "accordion", "button") |
Implementation Reference
- The main execution logic for the 'get_component' tool: asynchronously fetches the source code of the specified shadcn/ui component using axios and returns it as MCP content.export async function handleGetComponent({ componentName }: { componentName: string }) { try { const axios = await getAxiosImplementation(); const sourceCode = await axios.getComponentSource(componentName); return { content: [{ type: "text", text: sourceCode }] }; } catch (error) { logError(`Failed to get component "${componentName}"`, error); throw new Error(`Failed to get component "${componentName}": ${error instanceof Error ? error.message : String(error)}`); } }
- Input schema defining the required 'componentName' parameter for the tool.export const schema = { componentName: { type: 'string', description: 'Name of the shadcn/ui component (e.g., "accordion", "button")' } };
- src/tools/index.ts:17-25 (registration)Registration of the handler for 'get_component' in the toolHandlers object, mapping the tool name to handleGetComponent.export const toolHandlers = { get_component: handleGetComponent, get_component_demo: handleGetComponentDemo, list_components: handleListComponents, get_component_metadata: handleGetComponentMetadata, get_directory_structure: handleGetDirectoryStructure, get_block: handleGetBlock, list_blocks: handleListBlocks };
- src/tools/index.ts:38-46 (registration)Full tool registration for 'get_component' including name, description, and inputSchema referencing the schema.'get_component': { name: 'get_component', description: 'Get the source code for a specific shadcn/ui v4 component', inputSchema: { type: 'object', properties: getComponentSchema, required: ['componentName'] } },
- src/tools/index.ts:27-35 (registration)Registration of the schema for 'get_component' in the toolSchemas object.export const toolSchemas = { get_component: getComponentSchema, get_component_demo: getComponentDemoSchema, list_components: listComponentsSchema, get_component_metadata: getComponentMetadataSchema, get_directory_structure: getDirectoryStructureSchema, get_block: getBlockSchema, list_blocks: listBlocksSchema };