$npx -y skills add DevExpress/agent-skills --skill devexpress-wpf-ai-chat-controlEmbed a Copilot-inspired AI chat interface in WPF apps with DevExpress AIChatControl — install DevExpress.AIIntegration.Wpf.Chat, change the project SDK to Microsoft.NET.Sdk.Razor, register an IChatClient (Azure OpenAI / OpenAI / Ollama / Semantic Kernel) with AIExtensionsContain
| 1 | # DevExpress WPF AI Chat Control |
| 2 | |
| 3 | `AIChatControl` embeds a ready-made, Copilot-style chat interface in your WPF app. The conversation flow (user messages, streaming assistant responses, Markdown rendering, file attachments, prompt suggestions, history) is built in — you supply an `IChatClient` (Azure OpenAI / OpenAI / Ollama / Semantic Kernel) and drop the control on a `ThemedWindow`. Under the hood it hosts the DevExpress Blazor `DxAIChat` component inside a `BlazorWebView`. |
| 4 | |
| 5 | This skill covers project setup, installing the NuGet, registering an AI client, placing the control, and the basic features (streaming, Markdown, file upload, prompt suggestions, history, manual message handling). |
| 6 | |
| 7 | ## When to Use This Skill |
| 8 | |
| 9 | Use this skill when you need to: |
| 10 | |
| 11 | - Embed an interactive AI chat (Copilot-style) in a WPF app |
| 12 | - Connect to Azure OpenAI / OpenAI / Ollama / Semantic Kernel via `IChatClient` |
| 13 | - Stream assistant responses as they're generated |
| 14 | - Render Markdown / code blocks in chat messages |
| 15 | - Let users attach files (PDF / images / text) to chat messages |
| 16 | - Persist and reload chat history (`SaveMessages` / `LoadMessages`) |
| 17 | - Manually intercept messages (`MessageSending`) — for guard rails, side channels, custom AI calls |
| 18 | - Display multiple chat surfaces with different AI services (`ChatClientServiceKey`) |
| 19 | |
| 20 | ## Critical Prerequisites |
| 21 | |
| 22 | | Requirement | Notes | |
| 23 | |---|---| |
| 24 | | **.NET 8.0 or newer** | The control is *not available* on .NET Framework or .NET 6 / 7 | |
| 25 | | **`Microsoft.NET.Sdk.Razor` project SDK** | Must change `<Project Sdk="Microsoft.NET.Sdk">` → `<Project Sdk="Microsoft.NET.Sdk.Razor">` | |
| 26 | | **WebView2 runtime** | Bundled with Windows 11; ship the installer for older Windows / Server | |
| 27 | | **`dx:ThemedWindow` host** | All official samples use ThemedWindow; design-time rendering not supported | |
| 28 | | **A registered `IChatClient`** | `AIExtensionsContainerDesktop.Default.RegisterChatClient(...)` at startup | |
| 29 | |
| 30 | > **No design-time rendering**: the chat surface only renders at runtime. Don't expect to see it in the XAML designer. |
| 31 | |
| 32 | ## NuGet Packages |
| 33 | |
| 34 | | Package | Purpose | When | |
| 35 | |---|---|---| |
| 36 | | `DevExpress.AIIntegration.Wpf.Chat` | The `AIChatControl` itself | Always | |
| 37 | | `DevExpress.Wpf` (or `DevExpress.Wpf.Core`) | Themes, `ThemedWindow`, `AIExtensionsContainerDesktop` | Always | |
| 38 | | `Microsoft.Extensions.AI` | `IChatClient` abstraction | Always | |
| 39 | | `Azure.AI.OpenAI` | Azure OpenAI client | If using Azure OpenAI | |
| 40 | | `OpenAI` | OpenAI client | If using OpenAI | |
| 41 | | `Microsoft.Extensions.AI.OpenAI` | `AsIChatClient()` extensions for OpenAI clients | If using OpenAI or Azure OpenAI | |
| 42 | | `OllamaSharp` | Ollama client | If using self-hosted Ollama | |
| 43 | | `Microsoft.SemanticKernel` (+ a `Microsoft.SemanticKernel.Connectors.*` package) | Semantic Kernel | If routing through Semantic Kernel | |
| 44 | |
| 45 | All DevExpress packages in a project must share the same version. |
| 46 | |
| 47 | For exact pinned versions and additional clients, see [getting-started.md](references/getting-started.md). |
| 48 | |
| 49 | ## XAML Namespaces |
| 50 | |
| 51 | ```xml |
| 52 | xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core" |
| 53 | xmlns:dxaichat="http://schemas.devexpress.com/winfx/2008/xaml/aichat" |
| 54 | ``` |
| 55 | |
| 56 | | Prefix | Use for | |
| 57 | |---|---| |
| 58 | | `dxaichat:` | `AIChatControl`, file upload settings, prompt suggestions | |
| 59 | | `dx:` | `ThemedWindow`, themes | |
| 60 | |
| 61 | ## Before You Start — Ask the Developer |
| 62 | |
| 63 | If the host agent has a structured question-asking tool available, use it to ask these questio |