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
| Name | Required | Description | Default |
|---|---|---|---|
| component | Yes | Nombre del componente | |
| properties | No | Propiedades del componente (ej: {label: 'Click me', icon: 'pi pi-check'}) |
Implementation Reference
- src/tools/GenerateCodeTool.ts:8-27 (handler)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); } } - src/models/ToolSchemas.ts:65-85 (schema)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"], }, }; } - src/server/PrimeNGServer.ts:142-143 (registration)Instantiation and initialization of the GenerateCodeTool instance in PrimeNGServer.
this.generateCodeTool = new GenerateCodeTool(this.codeGeneratorService); this.getExamplesTool = new GetExamplesTool( - src/server/PrimeNGServer.ts:214-215 (registration)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); - src/server/PrimeNGServer.ts:184-184 (registration)Tool schema included in the tools list returned by ListToolsRequestSchema handler.
createGenerateComponentCodeSchema(this.components),