Skip to main content
Glama

generate_component_code

Generate Angular UI code examples for PrimeNG components with specified properties to accelerate development.

Instructions

Genera código de ejemplo para un componente de PrimeNG con las propiedades especificadas

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
componentYesNombre del componente
propertiesNoPropiedades del componente (ej: {label: 'Click me', icon: 'pi pi-check'})

Implementation Reference

  • GenerateCodeTool class implementing the handler logic for the 'generate_component_code' tool. Sets tool name in constructor and executes code generation via CodeGeneratorService.
    export class GenerateCodeTool extends BaseTool { private codeGenerator: CodeGeneratorService; constructor(codeGenerator: CodeGeneratorService) { super('generate_component_code'); this.codeGenerator = codeGenerator; } async execute(args: Record<string, any>): Promise<ToolResponse> { const component = args.component as string; const properties = (args.properties as Record<string, any>) || {}; if (!component) { return this.createErrorResponse('Component name is required'); } const code = this.codeGenerator.generateComponentCode(component, properties); return this.createResponse(code); } }
  • Core implementation of generateComponentCode method that creates Angular standalone component code with import, TS class, and HTML template using provided properties.
    generateComponentCode(component: string, properties: Record<string, any> = {}): string { try { logger.debug(`Generating code for ${component}`, { properties }); const capitalizedComponent = capitalizeComponentName(component); const propsString = this.formatProperties(properties); const content = this.getComponentContent(component); const code = ` <!-- Component Import --> import { ${capitalizedComponent}Module } from 'primeng/${component}'; <!-- Component.ts --> @Component({ selector: 'app-example', standalone: true, imports: [${capitalizedComponent}Module], templateUrl: './example.component.html' }) export class ExampleComponent { // Tu lógica aquí } <!-- Component.html --> <p-${component} ${propsString}> ${content} </p-${component}> `.trim(); return code; } catch (error) { const errorMessage = error instanceof Error ? error.message : String(error); logger.error(`Failed to generate code for ${component}`, { error: errorMessage }); throw new CodeGenerationError(`Failed to generate code for ${component}`, error); } }
  • Input schema definition for the generate_component_code tool, specifying component name (from enum) and optional properties object.
    export function createGenerateComponentCodeSchema(components: string[]): Tool { return { name: "generate_component_code", description: "Genera código de ejemplo para un componente de PrimeNG con las propiedades especificadas", inputSchema: { type: "object", properties: { component: { type: "string", description: "Nombre del componente", enum: components, }, properties: { type: "object", description: "Propiedades del componente (ej: {label: 'Click me', icon: 'pi pi-check'})", }, }, required: ["component"], }, }; }
  • Instantiation and initialization of the GenerateCodeTool instance in PrimeNGServer.
    this.generateCodeTool = new GenerateCodeTool(this.codeGeneratorService); this.getExamplesTool = new GetExamplesTool(
  • Registration in the tool dispatch switch case in CallToolRequestSchema handler, routing calls to generateCodeTool.run().
    case "generate_component_code": return await this.generateCodeTool.run(args);
  • Tool schema included in the tools list returned by ListToolsRequestSchema handler.
    createGenerateComponentCodeSchema(this.components),

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/hnkatze/PrimeNG_MCP'

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