Add AI coding skills prompt to cli-config schematic with conditional agent selection

.gitignore

@@ -12,6 +12,7 @@
 # ignore compiled files in packages
 /packages/**/*.js.map
 /packages/**/*.js
+/packages/**/*.d.ts
 /scripts/**/*.js.map
 /scripts/**/*.js
 /spec/**/*.js.map

packages/cli/lib/PromptSession.ts

@@ -95,6 +95,7 @@ export class PromptSession extends BasePromptSession {
 
 	protected async completeAndRun(port?: number) {
 		await PackageManager.flushQueue(true);
+		await PackageManager.installPackages();
 		await start.start({ port });
 	}
 

packages/cli/lib/ai-skills.ts

@@ -0,0 +1,6 @@
+import { copyAISkillsToProject as _copyFromCore } from "@igniteui/cli-core";
+
+export function copyAISkillsToProject(): "copied" | "up-to-date" | "no-source" {
+	return _copyFromCore();
+}
+

packages/cli/lib/cli.ts

@@ -3,6 +3,7 @@ import yargs from "yargs";
 import {
 	add,
 	ADD_COMMAND_NAME,
+	addSkills,
 	ALL_COMMANDS,
 	build,
 	config,
@@ -46,6 +47,7 @@ export async function run(args = null) {
 		.usage("") // do not show any usage instructions before the commands list
 		.command(newCommand)
 		.command(add)
+		.command(addSkills)
 		.command(build)
 		.command(start)
 		.command(generate)

packages/cli/lib/commands/add-skills.ts

@@ -0,0 +1,32 @@
+import { GoogleAnalytics, Util } from "@igniteui/cli-core";
+import { copyAISkillsToProject } from "../ai-skills";
+import { CommandType } from "./types";
+
+const command: CommandType = {
+	command: "add-skills",
+	describe: "Copies AI coding skills to the current project",
+	builder: {},
+	async handler() {
+		GoogleAnalytics.post({
+			t: "screenview",
+			cd: "Add Skills"
+		});
+
+		GoogleAnalytics.post({
+			t: "event",
+			ec: "$ig add-skills"
+		});
+
+		const result = copyAISkillsToProject();
+		if (result === "copied") {
+			Util.log(Util.greenCheck() + " AI skills added to the project.");
+		} else if (result === "up-to-date") {
+			Util.log(Util.greenCheck() + " AI skills are already up to date.");
+		} else {
+			Util.warn("No AI skill files found. Make sure packages are installed (npm install) " +
+				"and your Ignite UI package includes a skills/ directory.", "yellow");
+		}
+	}
+};
+
+export default command;

packages/cli/lib/commands/index.ts

@@ -1,4 +1,5 @@
 export { default as add } from "./add";
+export { default as addSkills } from "./add-skills";
 export { default as build } from "./build";
 export { default as config } from "./config";
 export { default as doc } from "./doc";

packages/cli/lib/commands/types.ts

@@ -3,6 +3,7 @@ import { TemplateManager } from "../TemplateManager";
 import { AddTemplateArgs, Template } from "@igniteui/cli-core";
 
 export const ADD_COMMAND_NAME = "add";
+export const ADD_SKILLS_COMMAND_NAME = "add-skills";
 export const NEW_COMMAND_NAME = "new";
 export const BUILD_COMMAND_NAME = "build";
 export const START_COMMAND_NAME = "start";
@@ -15,6 +16,7 @@ export const UPGRADE_COMMAND_NAME = "upgrade-packages";
 
 export const ALL_COMMANDS = new Set([
   ADD_COMMAND_NAME,
+  ADD_SKILLS_COMMAND_NAME,
   NEW_COMMAND_NAME,
   BUILD_COMMAND_NAME,
   START_COMMAND_NAME,

packages/core/prompt/InquirerWrapper.ts

@@ -1,4 +1,4 @@
-import { checkbox, input, select, Separator } from '@inquirer/prompts';
+import { checkbox, confirm, input, select, Separator } from '@inquirer/prompts';
 import { Context } from '@inquirer/type';
 
 // ref - node_modules\@inquirer\input\dist\cjs\types\index.d.ts - bc for some reason this is not publicly exported
@@ -32,4 +32,8 @@ export class InquirerWrapper {
 	public static async checkbox(message: InputConfig & { choices: (string | Separator)[] }, context?: Context): Promise<string[]> {
 		return checkbox(message, context);
 	}
+
+	public static async confirm(message: { message: string; default?: boolean }, context?: Context): Promise<boolean> {
+		return confirm(message, context);
+	}
 }

packages/core/util/FileSystem.ts

@@ -19,6 +19,7 @@ export class FsFileSystem implements IFileSystem {
 		return fs.readFileSync(filePath).toString();
 	}
 	public writeFile(filePath: string, text: string): void {
+		fs.mkdirSync(path.dirname(filePath), { recursive: true });
 		fs.writeFileSync(filePath, text);
 	}
 	public directoryExists(dirPath: string): boolean {

packages/core/util/ai-skills.ts

@@ -0,0 +1,85 @@
+import * as path from "path";
+import { App } from "./App";
+import { IFileSystem, FS_TOKEN } from "../types/FileSystem";
+import { ProjectConfig } from "./ProjectConfig";
+import { Util } from "./Util";
+import { NPM_ANGULAR, NPM_REACT, resolvePackage, UPGRADEABLE_PACKAGES } from "../update/package-resolve";
+
+const CLAUDE_SKILLS_DIR = ".claude/skills";
+
+/**
+ * Returns the list of 'skills/' directory paths found in installed
+ * Ignite UI packages that are relevant to the project's detected framework.
+ */
+function resolveSkillsRoots(): string[] {
+	const fs = App.container.get<IFileSystem>(FS_TOKEN);
+	const roots: string[] = [];
+
+	let framework: string | null = null;
+	try {
+		if (ProjectConfig.hasLocalConfig()) {
+			framework = ProjectConfig.getConfig().project?.framework?.toLowerCase() ?? null;
+		}
+	} catch { /* config not readable – fall through to scan all */ }
+
+	const allPkgKeys = Object.keys(UPGRADEABLE_PACKAGES);
+	let candidates: string[];
+	if (framework === "angular") {
+		candidates = [NPM_ANGULAR];
+	} else if (framework === "react") {
+		candidates = [NPM_REACT];
+	} else if (framework === "webcomponents") {
+		candidates = allPkgKeys.filter(k => k.startsWith("igniteui-webcomponents"));
+	} else {
+		candidates = allPkgKeys;
+	}
+
+	for (const pkg of candidates) {
+		const resolved = resolvePackage(pkg as keyof typeof UPGRADEABLE_PACKAGES);
+		const skillsRoot = `node_modules/${resolved}/skills`;
+		if (fs.directoryExists(skillsRoot) && !roots.includes(skillsRoot)) {
+			roots.push(skillsRoot);
+		}
+	}
+
+	return roots;
+}
+
+/**
+ * Copies skill files from the installed Ignite UI package(s) into .claude/skills/.
+ * Works with both real FS (CLI) and virtual Tree FS (schematics) through IFileSystem.
+ */
+export function copyAISkillsToProject(): "copied" | "up-to-date" | "no-source" {
+	const fs = App.container.get<IFileSystem>(FS_TOKEN);
+	const skillsRoots = resolveSkillsRoots();
+
+	if (!skillsRoots.length) {
+		return "no-source";
+	}
+
+	const multiRoot = skillsRoots.length > 1;
+	let copied = false;
+
+	for (const skillsRoot of skillsRoots) {
+		const rawPaths = fs.glob(skillsRoot, "**/*");
+		const pkgDirName = multiRoot ? path.basename(path.dirname(skillsRoot)) : "";
+
+		for (const p of rawPaths) {
+			// Normalize to posix and strip leading '/' so path.posix.relative works
+			// across both FsFileSystem (relative paths) and NgTreeFileSystem (tree-rooted paths)
+			const normP = p.replace(/\\/g, "/").replace(/^\//, "");
+			const normRoot = skillsRoot.replace(/\\/g, "/").replace(/^\//, "");
+			const rel = path.posix.relative(normRoot, normP);
+			const dest = multiRoot
+				? `${CLAUDE_SKILLS_DIR}/${pkgDirName}/${rel}`
+				: `${CLAUDE_SKILLS_DIR}/${rel}`;
+
+			if (!fs.fileExists(dest)) {
+				fs.writeFile(dest, fs.readFile(p));
+				Util.log(`${Util.greenCheck()} Created ${dest}`);
+				copied = true;
+			}
+		}
+	}
+	return copied ? "copied" : "up-to-date";
+}

packages/core/util/index.ts

@@ -1,3 +1,4 @@
+export * from './ai-skills';
 export * from './GoogleAnalytics';
 export * from './Util';
 export * from './ProjectConfig';

packages/ng-schematics/src/cli-config/index.ts

@@ -1,12 +1,17 @@
 import * as ts from "typescript";
 import { DependencyNotFoundException } from "@angular-devkit/core";
 import { chain, FileDoesNotExistException, Rule, SchematicContext, Tree } from "@angular-devkit/schematics";
+import { ScopedTree } from "@angular-devkit/schematics/src/tree/scoped";
 import { addClassToBody, FormatSettings, NPM_ANGULAR, resolvePackage, TypeScriptAstTransformer, TypeScriptUtils } from "@igniteui/cli-core";
 import { AngularTypeScriptFileUpdate } from "@igniteui/angular-templates";
 import { createCliConfig } from "../utils/cli-config";
 import { setVirtual } from "../utils/NgFileSystem";
 import { addFontsToIndexHtml, getProjects, importDefaultTheme } from "../utils/theme-import";
 
+interface CliConfigOptions {
+	directory?: string;
+}
+
 function getDependencyVersion(pkg: string, tree: Tree): string {
 	const targetFile = "/package.json";
 	if (tree.exists(targetFile)) {
@@ -117,15 +122,17 @@ function importStyles(): Rule {
 	};
 }
 
-export default function (): Rule {
-	return (tree: Tree) => {
+export default function (options: CliConfigOptions = {}): Rule {
+	return (originalTree: Tree, context: SchematicContext) => {
+		const tree = options.directory ? new ScopedTree(originalTree, options.directory) : originalTree;
 		setVirtual(tree);
-		return chain([
+		const rules: Rule[] = [
 			importStyles(),
 			addTypographyToProj(),
 			importBrowserAnimations(),
 			createCliConfig(),
 			displayVersionMismatch()
-		]);
+		];
+		return chain(rules)(tree, context);
 	};
 }

packages/ng-schematics/src/cli-config/schema.json

@@ -0,0 +1,8 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "igniteui-angular-cli-config",
+  "title": "Ignite UI for Angular CLI Config Options Schema",
+  "type": "object",
+  "properties": {},
+  "required": []
+}

packages/ng-schematics/src/collection.json

@@ -31,7 +31,8 @@
     },
     "cli-config": {
       "description": "Installs the needed dependencies onto the host application.",
-      "factory": "./cli-config/index"
+      "factory": "./cli-config/index",
+      "schema": "./cli-config/schema.json"
     },
     "upgrade-packages": {
       "description": "Upgrades to the licensed Ignite UI for Angular packages",

packages/ng-schematics/src/component/index.ts

@@ -87,6 +87,7 @@ export function component(options: ComponentOptions): Rule {
 			component: projLib.components,
 			custom: projLib.getCustomTemplates()
 		};
+		void properties; // cache templates for use inside chooseActionLoop
 		let prompt: SchematicsPromptSession;
 		if (!options.template || !options.name) {
 			prompt = new SchematicsPromptSession(templateManager);

packages/ng-schematics/src/ng-new/index.ts

@@ -96,11 +96,6 @@ export function newProject(options: OptionsSchema): Rule {
 					const theme = projLibrary.themes[themeIndex];
 					Util.log(`Project Name: ${options.name}, theme ${theme}`);
 
-					// project options:
-					// cache available views and components, same as in component Schematic
-					const components = projLibrary.components;
-					const views = (projLibrary as any).customTemplates;
-
 					projectOptions = {
 						projTemplate,
 						theme,
@@ -180,6 +175,13 @@ export function newProject(options: OptionsSchema): Rule {
 					installChain.push(gitTask);
 				}
 
+				if (!options.skipInstall) {
+					context.addTask(
+						new RunSchematicTask("cli-config", {}),
+						[...installChain]
+					);
+				}
+
 				if (!options.skipInstall && !nameProvided) {
 					context.addTask(new RunSchematicTask("start", { directory: options.name }), installChain);
 				}

packages/ng-schematics/src/start/index.ts

@@ -7,7 +7,6 @@ import { setVirtual } from "../utils/NgFileSystem";
 export default function(options: any): Rule {
 	return (tree: Tree, _context: SchematicContext) => {
 		return defer(async () => {
-			// TODO: ScopedTree iffy import
 			setVirtual(options.directory ? new ScopedTree(tree, options.directory) : tree);
 			const config = ProjectConfig.getConfig();
 			// TODO: call in ng serve directly somehow?

spec/acceptance/help-spec.ts

@@ -16,6 +16,7 @@ describe("Help command", () => {
 		const originalHelpText: string = `Commands:
 		new [name]             creates a project
 		add [template] [name]  adds template by its ID
+		add-skills             Copies AI coding skills to the current project
 		build                  builds the project
 		start                  starts the project
 		generate               generates custom template                  [aliases: g]

spec/unit/PromptSession-spec.ts

@@ -468,6 +468,7 @@ describe("Unit - PromptSession", () => {
 		spyOn(Util, "log");
 		spyOn(add, "addTemplate").and.returnValue(Promise.resolve(true));
 		spyOn(PackageManager, "flushQueue").and.returnValue(Promise.resolve());
+		spyOn(PackageManager, "installPackages").and.returnValue(Promise.resolve());
 		spyOn(start, "start").and.returnValue(Promise.resolve());
 
 		spyOn(InquirerWrapper, "select").and.returnValues(
@@ -660,6 +661,7 @@ describe("Unit - PromptSession", () => {
 		spyOn(Util, "log");
 		spyOn(add, "addTemplate").and.returnValue(Promise.resolve(true));
 		spyOn(PackageManager, "flushQueue").and.returnValue(Promise.resolve());
+		spyOn(PackageManager, "installPackages").and.returnValue(Promise.resolve());
 		//spyOn(start, "start").and.returnValue(Promise.resolve({port: 3333 }));
 		spyOn(start, "start").and.returnValue(Promise.resolve());