Function generateComponent

src/nodes/code/utils.ts:149–173

(node: Protocol, state: GraphState, assetFilesList: string, progressInfo: string)

 * Components are self-contained UI elements driven by props
 */
export async function generateComponent(node: Protocol, state: GraphState, assetFilesList: string, progressInfo: string): Promise<void> {
    const componentName = node.data.componentName || node.data.name || 'UnknownComponent';
    const componentPath = node.data.componentPath || node.data.path || '';

    logger.printInfoLog(`${progressInfo} 📦 Generating Component: ${componentName}`);

    // Generate prompt
    const prompt = generateComponentPrompt({
        componentName,
        componentDetails: JSON.stringify(node.data),
        styling: JSON.stringify(DEFAULT_STYLING),
        assetFiles: assetFilesList,
    });

    // Call AI model
    const code = await callModel({
        question: prompt,
        imageUrls: state.figmaInfo.thumbnail,
    });

    // Save generated files
    const filePath = workspaceManager.resolveAppSrc(state.workspace, workspaceManager.resolveComponentPath(componentPath));
    saveGeneratedCode(code, filePath);
    logger.printSuccessLog(`Successfully generated component: ${componentName}`);
}

/**
 * Helper function to save generated code (handles both single and multi-file output)