Skip to content
This repository was archived by the owner on Jun 8, 2026. It is now read-only.
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 12 additions & 24 deletions doc/en/components/ai/ai-assisted-development-overview.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,18 +9,6 @@ namespace: Infragistics.Controls
mentionedTypes: []
---

<!-- schema: Article -->
<!-- cspell:words igniteui mcpservers npx theming -->

<!-- feature-meta
name: AI-Assisted Development
category: toolchain
tools: [agent-skills, cli-mcp, theming-mcp, design-to-code]
frameworks: [Angular, React, WebComponents]
clients: [VS Code with GitHub Copilot, Cursor, Claude Desktop, Claude Code, JetBrains AI Assistant]
mcp-transport: STDIO
-->

# AI-Assisted Development with Ignite UI

Ignite UI for Angular, React, and Web Components provides a three-part AI toolchain - Agent Skills, the Ignite UI CLI MCP server, and the Ignite UI Theming MCP server - that grounds AI coding assistants in correct component APIs, import paths, and design tokens. Agent Skills are developer-owned instruction packages that define how AI agents use Ignite UI in a specific project. The CLI MCP server exposes Ignite UI CLI scaffolding, component management, and documentation tools to the active AI agent session via the Model Context Protocol. The Theming MCP server exposes the Ignite UI Theming Engine as queryable agent context. All three components work with GitHub Copilot, Cursor, Claude Desktop, Claude Code, and JetBrains AI Assistant.
Expand Down Expand Up @@ -149,21 +137,21 @@ Add the `igniteui-theming` entry to the same MCP configuration file, alongside `

For configuration details and theming workflows, see [Theming MCP](theming-mcp.md).

## Additional Resources

<!-- React -->
For a single end-to-end example that combines project work, documentation questions, and theming in one conversation, see [Build an App End-to-End with Ignite UI CLI MCP and Ignite UI Theming MCP](../general-how-to-mcp-e2e.md).
- [Build an App End-to-End with Ignite UI CLI MCP and Ignite UI Theming MCP](../general-how-to-mcp-e2e.md)
<!-- end: React -->
<!-- WebComponents -->
For a single end-to-end example that combines project work, documentation questions, and theming in one conversation, see [Build an App End-to-End with Ignite UI CLI MCP and Ignite UI Theming MCP](../general-how-to-mcp-e2e.md).
- [Build an App End-to-End with Ignite UI CLI MCP and Ignite UI Theming MCP](../general-how-to-mcp-e2e.md)
<!-- end: WebComponents -->
- [Agent Skills](./skills.md)
- [Ignite UI CLI MCP](./cli-mcp.md)
- [Ignite UI Theming MCP](./theming-mcp.md)

## Related Topics
<div class="divider--half"></div>

- [Agent Skills](skills.md) - Full setup guide for loading and wiring Skill packages in VS Code, Cursor, Windsurf, and JetBrains
- [CLI MCP](cli-mcp.md) - Full setup guide for Ignite UI CLI MCP, including recommended CLI-first setup and client-specific configuration
<!-- React -->
- [Build an App End-to-End with Ignite UI CLI MCP and Ignite UI Theming MCP](../general-how-to-mcp-e2e.md) - A concrete combined workflow from project work to documentation questions to theming in one chat session
<!-- end: React -->
<!-- WebComponents -->
- [Build an App End-to-End with Ignite UI CLI MCP and Ignite UI Theming MCP](../general-how-to-mcp-e2e.md) - A concrete combined workflow from project work to documentation questions to theming in one chat session
<!-- end: WebComponents -->
- [Theming MCP](theming-mcp.md) - Theming MCP server setup and theming workflow examples
Our community is active and always welcoming to new ideas.

- [{ProductName} **Forums**]({ForumsLink})
- [{ProductName} **GitHub**]({GithubLink})
8 changes: 4 additions & 4 deletions doc/en/components/ai/cli-mcp.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: "{Platform} Ignite UI CLI MCP | Infragistics"
_description: "Connect Ignite UI CLI MCP to your AI client to scaffold projects, modify existing apps, create and update components, and ask documentation questions for {ProductName}. Learn the setup options for VS Code, GitHub, Cursor, Claude Desktop, Claude Code, JetBrains, and other MCP clients."
_keywords: "{Platform}, {ProductName}, Infragistics, Ignite UI CLI MCP, Ignite UI Theming MCP, MCP, Model Context Protocol, AI, agent, GitHub Copilot, Cursor, Claude, JetBrains"
title: {Platform} Ignite UI CLI MCP | Infragistics
_description: Connect Ignite UI CLI MCP to your AI client to scaffold projects, modify existing apps, create and update components, and ask documentation questions for {ProductName}. Learn the setup options for VS Code, GitHub, Cursor, Claude Desktop, Claude Code, JetBrains, and other MCP clients.
_keywords: {Platform}, {ProductName}, Infragistics, Ignite UI CLI MCP, Ignite UI Theming MCP, MCP, Model Context Protocol, AI, agent, GitHub Copilot, Cursor, Claude, JetBrains
_language: en
_license: MIT
_canonicalLink: "{environment:dvUrl}/components/ai/cli-mcp"
Expand Down Expand Up @@ -453,13 +453,13 @@ Validate that the JSON uses the `mcpServers` structure and that each local serve

## Additional Resources

- [AI-Assisted Development with Ignite UI](./ai-assisted-development-overview.md)
<!-- React -->
- [Build an App End-to-End with Ignite UI CLI MCP and Ignite UI Theming MCP](../general-how-to-mcp-e2e.md)
<!-- end: React -->
<!-- WebComponents -->
- [Build an App End-to-End with Ignite UI CLI MCP and Ignite UI Theming MCP](../general-how-to-mcp-e2e.md)
<!-- end: WebComponents -->
- [AI-Assisted Development with Ignite UI](./ai-assisted-development-overview.md)
- [{ProductName} Skills](./skills.md)
- [Ignite UI Theming MCP](./theming-mcp.md)

Expand Down
3 changes: 3 additions & 0 deletions doc/en/components/ai/skills.md
Original file line number Diff line number Diff line change
Expand Up @@ -386,6 +386,9 @@ For more information on the Theming MCP, refer to the [Ignite UI Theming MCP](./
- <a href="https://www.infragistics.com/products/ignite-ui-angular/angular/components/general/getting-started">Getting Started with {ProductName}</a>
- <a href="https://www.infragistics.com/products/ignite-ui-angular/angular/components/general/cli-overview">Angular Schematics & Ignite UI CLI</a>
<!-- end: Angular -->
- [AI-Assisted Development with Ignite UI](./ai-assisted-development-overview.md)
- [Ignite UI CLI MCP](./cli-mcp.md)
- [Ignite UI Theming MCP](./theming-mcp.md)

<div class="divider--half"></div>
Our community is active and always welcoming to new ideas.
Expand Down
2 changes: 2 additions & 0 deletions doc/en/components/ai/theming-mcp.md
Original file line number Diff line number Diff line change
Expand Up @@ -380,7 +380,9 @@ Also confirm that `core()` is called before any other theming mixin in your `sty
<!-- WebComponents -->
- [Build an App End-to-End with Ignite UI CLI MCP and Ignite UI Theming MCP](../general-how-to-mcp-e2e.md)
<!-- end: WebComponents -->
- [AI-Assisted Development with Ignite UI](./ai-assisted-development-overview.md)
- [{ProductName} Skills](./skills.md)
- [Ignite UI CLI MCP](./cli-mcp.md)

<!-- Ideally these should be included once documentation is combined
- [Theming Overview](../themes/index.md)
Expand Down
9 changes: 5 additions & 4 deletions doc/en/components/general-how-to-mcp-e2e.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: "Build an App End-to-End with Ignite UI CLI MCP and Ignite UI Theming MCP - {ProductName}"
_description: "Follow an end-to-end {ProductName} workflow with Ignite UI CLI MCP and Ignite UI Theming MCP: start CLI-first, connect both MCP servers, create or extend the app through chat, ask documentation questions, and apply a custom theme."
_keywords: "{Platform}, {ProductName}, Infragistics, Ignite UI CLI MCP, Ignite UI Theming MCP, MCP, Model Context Protocol, AI, workflow, theming, prompt"
title: Build an App End-to-End with Ignite UI CLI MCP and Ignite UI Theming MCP - {ProductName}
_description: Follow an end-to-end {ProductName} workflow with Ignite UI CLI MCP and Ignite UI Theming MCP start CLI-first, connect both MCP servers, create or extend the app through chat, ask documentation questions, and apply a custom theme.
_keywords: {Platform}, {ProductName}, Infragistics, Ignite UI CLI MCP, Ignite UI Theming MCP, MCP, Model Context Protocol, AI, workflow, theming, prompt
_language: en
_license: MIT
_canonicalLink: "{environment:dvUrl}/components/general-how-to-mcp-e2e"
Expand Down Expand Up @@ -265,9 +265,10 @@ In practice, the most effective pattern is to use CLI MCP for project and compon

## Related Topics

- [AI-Assisted Development with Ignite UI](ai/ai-assisted-development-overview.md)
- [{ProductName} Skills](ai/skills.md)
- [Ignite UI CLI MCP](ai/cli-mcp.md)
- [Ignite UI Theming MCP](ai/theming-mcp.md)
- [AI-Assisted Development with Ignite UI](ai/ai-assisted-development-overview.md)

<div class="divider--half"></div>

Expand Down
Loading