import { MCPTool } from "./index.js";
import { COMPONENTS_DB } from "../data/components.js";
export const generateTemplateCodeTool: MCPTool = {
name: "generate_ntv_template_code",
description:
"Generates HTML template code for an NTV component with optional custom configuration",
inputSchema: {
type: "object",
properties: {
component: {
type: "string",
description: "Component name (e.g., 'Button', 'Input')",
},
variant: {
type: "string",
description: "Visual variant (e.g., 'primary', 'secondary' for Button)",
},
size: {
type: "string",
description: "Component size (e.g., 'sm', 'md', 'lg')",
},
content: {
type: "string",
description: "Content/text to display inside component",
},
additionalProps: {
type: "object",
description:
"Additional properties as key-value pairs (e.g., {disabled: true})",
},
useConfigPattern: {
type: "boolean",
description:
"Use the config object pattern (recommended for multiple props). Default: true",
},
},
required: ["component"],
},
execute: async (args: Record<string, unknown>) => {
const componentName = args.component as string;
const variant = args.variant as string | undefined;
const size = args.size as string | undefined;
const content = args.content as string | undefined;
const additionalProps = args.additionalProps as Record<string, unknown> | undefined;
const useConfigPattern = args.useConfigPattern !== false;
const component = COMPONENTS_DB.find(
(c) => c.name.toLowerCase() === componentName.toLowerCase()
);
if (!component) {
throw new Error(`Component '${componentName}' not found`);
}
let template = "";
if (useConfigPattern && component.configInterface) {
// Generate config pattern template
const configProps: Record<string, unknown> = {};
if (variant) configProps.variant = variant;
if (size) configProps.size = size;
if (additionalProps) {
Object.assign(configProps, additionalProps);
}
template = `<${component.selector} [config]="${JSON.stringify(configProps).replace(/"/g, "'")}">\n ${content || component.description}\n</${component.selector}>`;
} else {
// Generate individual props template
let props = "";
if (variant) props += ` variant="${variant}"`;
if (size) props += ` size="${size}"`;
if (additionalProps) {
for (const [key, value] of Object.entries(additionalProps)) {
if (typeof value === "string") {
props += ` ${key}="${value}"`;
} else if (typeof value === "boolean") {
props += ` [${key}]="${value}"`;
} else {
props += ` [${key}]='${JSON.stringify(value)}'`;
}
}
}
template = `<${component.selector}${props}>\n ${content || component.description}\n</${component.selector}>`;
}
return {
component: componentName,
template,
imports: `import { ${component.name} } from '@ntv-scaffolding/component-pantry';`,
componentDecorator: {
selector: `app-example`,
standalone: true,
imports: `[${component.name}]`,
},
};
},
};