From 5c9c6a4a19f828c7086366de4310c78e960ca861 Mon Sep 17 00:00:00 2001 From: Yordan Mitev Date: Wed, 5 Nov 2025 14:51:30 +0200 Subject: [PATCH 1/3] Add NuGet distribution to mcp-server.md --- ai/mcp-server.md | 305 ++++++++++++++++++++++++++++++++--------------- 1 file changed, 206 insertions(+), 99 deletions(-) diff --git a/ai/mcp-server.md b/ai/mcp-server.md index 978bf745..7704f992 100644 --- a/ai/mcp-server.md +++ b/ai/mcp-server.md @@ -7,145 +7,249 @@ tags: telerik,maui,ai,ai server,dotnetmaui,coding assistant position: 1 --- -# Telerik .NET MAUI MCP Server +# Telerik UI for .NET MAUI MCP Server -The Telerik MAUI [MCP (Model Context Protocol) Server](https://modelcontextprotocol.io/introduction) enhances your AI-powered development experience by providing specialized context about Telerik UI for .NET MAUI components. +The Telerik MAUI [MCP (Model Context Protocol) server](https://modelcontextprotocol.io/introduction) enhances your AI-powered development experience by providing specialized context about Telerik UI for .NET MAUI components. This MCP server enables AI-powered IDEs and tools to generate more accurate, tailored code that leverages [Telerik UI for .NET MAUI components](https://www.telerik.com/maui-ui) and APIs. You can ask complex questions about Telerik components, request specific implementations, and generate comprehensive code solutions. ->tip The Telerik .NET MAUI MCP Server works in **Chat**(**Ask**) and **Agent** modes. +>tip The Telerik MAUI MCP server works in **Chat** (**Ask**) and **Agent** modes. ## Prerequisites To use the Telerik MAUI MCP server, you need: -* [Node.js](https://nodejs.org/en) 18 or newer. -* An [MCP-compatible client](https://modelcontextprotocol.io/clients) that supports **MCP tools** (latest version recommended). +* [.NET](https://learn.microsoft.com/en-us/dotnet/core/whats-new/dotnet-8/overview) 8 or later, or [Node.js](https://nodejs.org/en) 18 or later. +* An [MCP-compatible client](https://modelcontextprotocol.io/clients) that supports MCP tools (latest version recommended). @[template](/_contentTemplates/common/ai-coding-assistant.md#getting-started) ## Installation -Install the Telerik MAUI MCP server using npm: +Depending on your environment, you can install the Telerik MAUI MCP server in any of the following ways: -```bash -npm i @progress/telerik-maui-mcp -``` +* By using the `dnx` script (.NET 10 or later only) or the `dotnet` CLI (.NET 8 and .NET 9) -### Configuration + ```bash .NET 10 + dnx Telerik.MAUI.MCP + ``` + ```bash .NET 8/9 + dotnet tool install Telerik.MAUI.MCP + ``` -Use these settings when configuring the server in your MCP client: +* By using npm: -| Setting | Value | -|---------|-------| -| Package Name | `@progress/telerik-maui-mcp` | -| Type | `stdio` (standard input/output transport) | -| Command | `npx` | -| Arguments | `-y` | -| Server Name | `telerik-maui-assistant` (customizable) | + ```bash + npm i @progress/telerik-maui-mcp + ``` -### License Configuration +Next, make sure the configuration in your `mcp.json` is [correct](#configuring-mcp-json), and then [add your Telerik license](#configuring-your-license). -Add your [Telerik license key]({%slug set-up-your-license%}) as an environment parameter in your `mcp.json` file using one of these options: +### Configuring mcp.json -Option 1: License File Path (Recommended) +Use the settings in the following table to configure the Telerik MAUI MCP server in the [`mcp.json` file](https://code.visualstudio.com/docs/copilot/customization/mcp-servers) of your code editor. Select the correct value based on your development environment. - ```json - "env": { - "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE" - } - ``` +| Setting Name | .NET 10 Value | .NET 8 / .NET 9 Value | Node.js Value | +|---------|---------------|-----------------------|---------------| +| Package Name | `"Telerik.MAUI.MCP"` | `"Telerik.MAUI.MCP"` | `"@progress/telerik-maui-mcp"` | +| Type | `"stdio"` | `"stdio"` | `"stdio"` | +| Command | `"dnx"` | `"dotnet"` | `"npx"` | +| Arguments | `"Telerik.MAUI.MCP", "--yes"` | `"tool", "run", "telerik-maui-mcp"` | `"-y"` | +| Server Name | `"telerik-maui-assistant"` | `"telerik-maui-assistant"` | `"telerik-maui-assistant"` | -Option 2: Direct License Key +### Configuring Your License - ```json - "env": { - "TELERIK_LICENSE": "YOUR_LICENSE_KEY_HERE" - } - ``` +An active Telerik UI for .NET MAUI license is required to use the Telerik MAUI MCP server. Add your [Telerik license key]({%slug set-up-your-license%}) as an environment variable in your `mcp.json` file using one of these options: -> Option 1 is recommended unless you're sharing settings across different systems. Remember to [update your license key]({%slug set-up-your-license%}#updating-your-license-key) when necessary. +* As a license file path (recommended) -## Visual Studio + ```json + "env": { + "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE" + } + ``` -For complete setup instructions, see [Use MCP servers in Visual Studio](https://learn.microsoft.com/en-us/visualstudio/ide/mcp-servers). +* As a license key value -> Early Visual Studio 17.14 versions require the Copilot Chat window to be open when opening a solution for the MCP server to work properly. + ```json + "env": { + "TELERIK_LICENSE": "YOUR_LICENSE_KEY_HERE" + } + ``` -### Workspace-Specific Setup: +> Using a license file path is recommended unless you're sharing settings across different systems. Remember to [update your license key]({%slug set-up-your-license%}#updating-your-license-key) when necessary. -1. Add `.mcp.json` to your solution folder: +## Visual Studio - ```json - { - "servers": { - "telerik-maui-assistant": { - "type": "stdio", - "command": "npx", - "args": ["-y", "@progress/telerik-maui-mcp@latest"], - "env": { - "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", - // or - "TELERIK_LICENSE": "YOUR_LICENSE_KEY" - } - } - } - } - ``` +> * Early Visual Studio 17.14 versions require the Copilot Chat window to be open when a solution loads for the MCP server to work properly. +> * For complete setup instructions, see [Use MCP servers in Visual Studio](https://learn.microsoft.com/en-us/visualstudio/ide/mcp-servers). + +1. Add an `.mcp.json` file to either of the following locations: + + * For a workspace-specific setup, add the file to the solution's folder. + * For a global setup, add the file to your user directory, `%USERPROFILE%` (for example, `C:\Users\YourName\.mcp.json`). + + ```json .NET 10 + { + "servers": { + "telerik-maui-assistant": { + "type": "stdio", + "command": "dnx", + "args": ["Telerik.MAUI.MCP", "--yes"], + "env": { + "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", + // or + "TELERIK_LICENSE": "YOUR_LICENSE_KEY" + } + } + } + } + ``` + ```json .NET 8/9 + { + "servers": { + "telerik-maui-assistant": { + "type": "stdio", + "command": "dotnet", + "args": ["tool", "run", "telerik-maui-mcp"], + "env": { + "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", + // or + "TELERIK_LICENSE": "YOUR_LICENSE_KEY" + } + } + } + } + ``` + ```json Node.js + { + "servers": { + "telerik-maui-assistant": { + "type": "stdio", + "command": "npx", + "args": ["-y", "@progress/telerik-maui-mcp@latest"], + "env": { + "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", + // or + "TELERIK_LICENSE": "YOUR_LICENSE_KEY" + } + } + } + } + ``` 2. Restart Visual Studio. -3. Enable the `telerik-maui-assistant` tool in the [Copilot Chat window's tool selection dropdown](https://learn.microsoft.com/en-us/visualstudio/ide/mcp-servers?view=vs-2022#configuration-example-with-github-mcp-server). - -### Global Setup: - -Add the `.mcp.json` file to your user directory (`%USERPROFILE%`, e.g., `C:\Users\YourName\.mcp.json`). +3. Enable the Telerik MAUI MCP server in the [Copilot Chat window's tool selection dropdown](https://learn.microsoft.com/en-us/visualstudio/ide/mcp-servers?view=vs-2022#configuration-example-with-github-mcp-server). ## Visual Studio Code -For complete setup instructions, see [Use MCP servers in Visual Studio Code](https://code.visualstudio.com/docs/copilot/chat/mcp-servers). - -> Visual Studio Code 1.102.1 or newer is required to use the Telerik MCP Server - -The basic setup in Visual Studio Code follows these steps: - -1. Enable [`chat.mcp.enabled`](vscode://settings/chat.mcp.enabled) in Visual Studio Code settings. -2. Create `.vscode/mcp.json` in your workspace root (or user folder for global setup): - - ```json - { - "servers": { - "telerik-maui-assistant": { - "type": "stdio", - "command": "npx", - "args": ["-y", "@progress/telerik-maui-mcp@latest"], - "env": { - "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", - // or - "TELERIK_LICENSE": "YOUR_LICENSE_KEY" - } - } - } - } - ``` +> * Visual Studio Code 1.102.1 or later is required to use the Telerik MAUI MCP Server. +> * For complete setup instructions, see [Use MCP servers in Visual Studio Code](https://code.visualstudio.com/docs/copilot/chat/mcp-servers). + +The basic setup in Visual Studio Code involves the following steps: + +1. Enable [`chat.mcp.enabled`](vscode://settings/chat.mcp.enabled) in the Visual Studio Code settings. +2. Create a `.vscode/mcp.json` file in your workspace root (or user folder for global setup): + + ```json .NET 10 + { + "servers": { + "telerik-maui-assistant": { + "type": "stdio", + "command": "dnx", + "args": ["Telerik.MAUI.MCP", "--yes"], + "env": { + "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", + // or + "TELERIK_LICENSE": "YOUR_LICENSE_KEY" + } + } + } + } + ``` + ```json .NET 8/9 + { + "servers": { + "telerik-maui-assistant": { + "type": "stdio", + "command": "dotnet", + "args": ["tool", "run", "telerik-maui-mcp"], + "env": { + "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", + // or + "TELERIK_LICENSE": "YOUR_LICENSE_KEY" + } + } + } + } + ``` + ```json Node.js + { + "servers": { + "telerik-maui-assistant": { + "type": "stdio", + "command": "npx", + "args": ["-y", "@progress/telerik-maui-mcp@latest"], + "env": { + "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", + // or + "TELERIK_LICENSE": "YOUR_LICENSE_KEY" + } + } + } + } + ``` 3. For global discovery, enable [`chat.mcp.discovery.enabled`](vscode://settings/chat.mcp.discovery.enabled) in `settings.json`: - ```json - { - "chat.mcp.discovery.enabled": true - } - ``` + ```json + { + "chat.mcp.discovery.enabled": true + } + ``` 4. Restart Visual Studio Code. ## Cursor -For complete setup instructions, see [Model Context Protocol](https://docs.cursor.com/context/mcp). +> For complete setup instructions, see [Model Context Protocol](https://docs.cursor.com/context/mcp). -Create `.cursor/mcp.json` in your workspace root (or user folder for global setup): +Create a `.cursor/mcp.json` file in your workspace root (or user folder for global setup): -```json +```json .NET 10 +{ + "mcpServers": { + "telerik-maui-assistant": { + "type": "stdio", + "command": "dnx", + "args": ["Telerik.MAUI.MCP", "--yes"], + "env": { + "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", + // or + "TELERIK_LICENSE": "YOUR_LICENSE_KEY" + } + } + } +} +``` +```json .NET 8/9 +{ + "mcpServers": { + "telerik-maui-assistant": { + "type": "stdio", + "command": "dotnet", + "args": ["tool", "run", "telerik-maui-mcp"], + "env": { + "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", + // or + "TELERIK_LICENSE": "YOUR_LICENSE_KEY" + } + } + } +} +``` +```json Node.js { "mcpServers": { "telerik-maui-assistant": { @@ -164,7 +268,9 @@ Create `.cursor/mcp.json` in your workspace root (or user folder for global setu ## Usage -To use the Telerik MCP Server: +By default, MCP clients do not call MCP tools in a deterministic way. Some MCP clients like VS Code allow you to explicitly reference the desired MCP tool in your prompt. + +To use the Telerik MAUI MCP server: 1. Start your prompt with one of these triggers: - `#telerik` @@ -178,18 +284,19 @@ To use the Telerik MCP Server: 3. Grant permissions when prompted (per session, workspace, or always). -4. Start fresh sessions for unrelated prompts to avoid context pollution. -5. Use in **Chat**(**Ask**) and **Agent** modes. +4. Start a fresh session for unrelated prompts to avoid context pollution. + +5. Use in **Chat** (**Ask**) and **Agent** modes. ### Improving Server Usage -To increase the likelihood of the Telerik MCP server being used, add custom instructions to your AI tool: +To increase the likelihood of the Telerik MAUI MCP server being used, add custom instructions to your AI tool: - [GitHub Copilot custom instructions](https://docs.github.com/en/copilot/customizing-copilot/adding-repository-custom-instructions-for-github-copilot#about-repository-custom-instructions-for-github-copilot-chat) - [Cursor rules](https://docs.cursor.com/context/rules) ### Sample Prompts -The following examples demonstrate useful prompts for the Telerik .NET MAUI MCP Server: +The following examples demonstrate useful prompts for the Telerik MAUI MCP server: * "`#telerik-maui-assistant Create new maui project with Telerik. Add sample usage of the DataGrid component.`" * "`#telerik-maui-assistant Create a DataGrid with 3 columns - Name, Country, City. Add the corresponding business object in the code behind and populate it with sample data. Add 20 entries to the data.`" @@ -203,9 +310,9 @@ The following examples demonstrate useful prompts for the Telerik .NET MAUI MCP You can use the Telerik MAUI MCP server with local large language models (LLMs): -1. Run a local model, for example, through [Ollama](https://ollama.com). +1. Run a local model, for example, [Ollama](https://ollama.com). 2. Use a bridge package like [MCP-LLM Bridge](https://github.com/patruff/ollama-mcp-bridge). -3. Connect your local model to the Telerik MCP server. +3. Connect your local model to the Telerik MAUI MCP server. This setup allows you to use the Telerik AI Coding Assistant without cloud-based AI models. From 24838b30b3431403a273ff010d20d5a60fdec35c Mon Sep 17 00:00:00 2001 From: Yordan Mitev Date: Thu, 6 Nov 2025 18:14:41 +0200 Subject: [PATCH 2/3] Address feedback from review --- ai/mcp-server.md | 70 +++++++++++++++--------------------------------- 1 file changed, 22 insertions(+), 48 deletions(-) diff --git a/ai/mcp-server.md b/ai/mcp-server.md index 7704f992..e2c1acdb 100644 --- a/ai/mcp-server.md +++ b/ai/mcp-server.md @@ -29,7 +29,7 @@ To use the Telerik MAUI MCP server, you need: Depending on your environment, you can install the Telerik MAUI MCP server in any of the following ways: -* By using the `dnx` script (.NET 10 or later only) or the `dotnet` CLI (.NET 8 and .NET 9) +* By using the `dnx` script (.NET 10 or later only) or the `dotnet` CLI (.NET 8 and .NET 9): ```bash .NET 10 dnx Telerik.MAUI.MCP @@ -55,28 +55,32 @@ Use the settings in the following table to configure the Telerik MAUI MCP server | Package Name | `"Telerik.MAUI.MCP"` | `"Telerik.MAUI.MCP"` | `"@progress/telerik-maui-mcp"` | | Type | `"stdio"` | `"stdio"` | `"stdio"` | | Command | `"dnx"` | `"dotnet"` | `"npx"` | -| Arguments | `"Telerik.MAUI.MCP", "--yes"` | `"tool", "run", "telerik-maui-mcp"` | `"-y"` | +| Arguments | `"Telerik.MAUI.MCP", "--yes"` | `"tool", "run", "telerik-maui-assistant"` | `"-y"` | | Server Name | `"telerik-maui-assistant"` | `"telerik-maui-assistant"` | `"telerik-maui-assistant"` | ### Configuring Your License -An active Telerik UI for .NET MAUI license is required to use the Telerik MAUI MCP server. Add your [Telerik license key]({%slug set-up-your-license%}) as an environment variable in your `mcp.json` file using one of these options: +An active Telerik UI for .NET MAUI license is required to use the Telerik MAUI MCP server. -* As a license file path (recommended) +* When installing the MCP server by using the .NET tooling (`dnx` or `dotnet tool install`), the [license key file]({%slug set-up-your-license%}) will be retrieved automatically if it is present in the default directory on your system. No additional action is required. +* When using the .NET tooling, but your [license key file]({%slug set-up-your-license%}) is not in the default directory, use one of the options below. +* When using Node.js, add your [license key file]({%slug set-up-your-license%}) as an environment variable in your `mcp.json` file using one of the options below: - ```json - "env": { - "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE" - } - ``` + * As a license file path (recommended) -* As a license key value + ```json + "env": { + "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE" + } + ``` - ```json - "env": { - "TELERIK_LICENSE": "YOUR_LICENSE_KEY_HERE" - } - ``` + * As a license key value + + ```json + "env": { + "TELERIK_LICENSE": "YOUR_LICENSE_KEY_HERE" + } + ``` > Using a license file path is recommended unless you're sharing settings across different systems. Remember to [update your license key]({%slug set-up-your-license%}#updating-your-license-key) when necessary. @@ -97,11 +101,6 @@ An active Telerik UI for .NET MAUI license is required to use the Telerik MAUI M "type": "stdio", "command": "dnx", "args": ["Telerik.MAUI.MCP", "--yes"], - "env": { - "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", - // or - "TELERIK_LICENSE": "YOUR_LICENSE_KEY" - } } } } @@ -112,12 +111,7 @@ An active Telerik UI for .NET MAUI license is required to use the Telerik MAUI M "telerik-maui-assistant": { "type": "stdio", "command": "dotnet", - "args": ["tool", "run", "telerik-maui-mcp"], - "env": { - "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", - // or - "TELERIK_LICENSE": "YOUR_LICENSE_KEY" - } + "args": ["tool", "run", "telerik-maui-assistant"], } } } @@ -159,11 +153,6 @@ The basic setup in Visual Studio Code involves the following steps: "type": "stdio", "command": "dnx", "args": ["Telerik.MAUI.MCP", "--yes"], - "env": { - "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", - // or - "TELERIK_LICENSE": "YOUR_LICENSE_KEY" - } } } } @@ -174,12 +163,7 @@ The basic setup in Visual Studio Code involves the following steps: "telerik-maui-assistant": { "type": "stdio", "command": "dotnet", - "args": ["tool", "run", "telerik-maui-mcp"], - "env": { - "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", - // or - "TELERIK_LICENSE": "YOUR_LICENSE_KEY" - } + "args": ["tool", "run", "telerik-maui-assistant"], } } } @@ -224,11 +208,6 @@ Create a `.cursor/mcp.json` file in your workspace root (or user folder for glob "type": "stdio", "command": "dnx", "args": ["Telerik.MAUI.MCP", "--yes"], - "env": { - "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", - // or - "TELERIK_LICENSE": "YOUR_LICENSE_KEY" - } } } } @@ -239,12 +218,7 @@ Create a `.cursor/mcp.json` file in your workspace root (or user folder for glob "telerik-maui-assistant": { "type": "stdio", "command": "dotnet", - "args": ["tool", "run", "telerik-maui-mcp"], - "env": { - "TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE", - // or - "TELERIK_LICENSE": "YOUR_LICENSE_KEY" - } + "args": ["tool", "run", "telerik-maui-assistant"], } } } From 1111820d9ad556a65e3831acf2b2a23e6d13a031 Mon Sep 17 00:00:00 2001 From: Yordan <60105689+yordan-mitev@users.noreply.github.com> Date: Thu, 6 Nov 2025 18:28:28 +0200 Subject: [PATCH 3/3] Implement Copilot suggestion --- ai/mcp-server.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ai/mcp-server.md b/ai/mcp-server.md index e2c1acdb..923e66fa 100644 --- a/ai/mcp-server.md +++ b/ai/mcp-server.md @@ -62,7 +62,7 @@ Use the settings in the following table to configure the Telerik MAUI MCP server An active Telerik UI for .NET MAUI license is required to use the Telerik MAUI MCP server. -* When installing the MCP server by using the .NET tooling (`dnx` or `dotnet tool install`), the [license key file]({%slug set-up-your-license%}) will be retrieved automatically if it is present in the default directory on your system. No additional action is required. +* When installing the MCP server by using the .NET tooling (`dnx` or `dotnet tool install`), the [license key file]({%slug set-up-your-license%}) will be retrieved automatically if it is present in the default directory on your system (`%AppData%\Telerik\telerik-license.txt` on Windows and `~/.telerik/telerik-license.txt` on Linux.). No additional action is required. * When using the .NET tooling, but your [license key file]({%slug set-up-your-license%}) is not in the default directory, use one of the options below. * When using Node.js, add your [license key file]({%slug set-up-your-license%}) as an environment variable in your `mcp.json` file using one of the options below: