get_component

Instructions

Implementation Reference

• src/tools/components/get-component.ts:4-15 (handler)

  The main handler function for the 'get_component' tool. Accepts { componentName } and calls axios.getComponentSource() to fetch the component source code from the shadcn/ui v4 GitHub registry, returning it as text 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)}`);
    }
  }

• src/tools/components/get-component.ts:17-22 (schema)

  Input schema for the 'get_component' tool, defining the 'componentName' parameter as a required string with a description.

  export const schema = {
    componentName: {
      type: 'string',
      description: 'Name of the shadcn/ui component (e.g., "accordion", "button")'
    }
  }; 

• src/tools/index.ts:46-55 (registration)

  Registration of the 'get_component' tool in the tools object, mapping it to the imported getComponentSchema and providing description and input schema.

  export const tools = {
    '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:20-31 (registration)

  Registration of the 'get_component' handler in the toolHandlers map, mapping the name 'get_component' to handleGetComponent function.

  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,
    apply_theme: handleApplyTheme,
    list_themes: handleListThemes,
    get_theme: handleGetTheme
  };

• src/utils/axios.ts:58-68 (helper)

  The getComponentSource() helper function that actually fetches the component source code from the GitHub raw URL for the shadcn/ui v4 registry.

  async function getComponentSource(componentName: string): Promise<string> {
      const basePath = getRegistryBasePath();
      const componentPath = `${basePath}/ui/${componentName.toLowerCase()}.tsx`;
      
      try {
          const response = await githubRaw.get(`/${componentPath}`);
          return response.data;
      } catch (error) {
          throw new Error(`Component "${componentName}" not found in v4 registry`);
      }
  }