# Smart Search AI-powered Extension | WPF Controls | DevExpress Documentation

Smart Search works alongside traditional search algorithms to offer a more powerful and user-friendly search experience. It offers results that are more aligned with what the user is seeking, even if the input contains spelling errors.

![AI-powered Smart Search](/WPF/images/ai-powered-smart-search.gif)

[Run Demo: Smart Search - WPF Ribbon](dxdemo://Wpf/DXAI/MainDemo/SmartSearchModule)

## Applies To

- [Themed Window with integrated Ribbon Control](/WPF/DevExpress.Xpf.Core.ThemedWindow#integrate-the-ribbon--tab-control)
- [Accordion Control](/WPF/118347/controls-and-libraries/navigation-controls/accordion-control)

## How It Works

When the user pauses typing in the search field within the Ribbon or Accordion control, the control sends the current search query to an AI service that understands context, synonyms, and user intent beyond exact keyword matches. Once the AI service returns its results, the control filters items accordingly.

## Activate Smart Search

To activate Smart Search you should install DevExpress AI NuGet packages and register the AI client.

### Install DevExpress NuGet Packages

1. `DevExpress.AIIntegration.Wpf`
2. `DevExpress.Wpf.Ribbon` / `DevExpress.Wpf.Accordion`

Tip

You can also install a unified NuGet package (`DevExpress.Wpf`) if you want to use most UI controls that ship as part of the DevExpress WPF UI Library.

Refer to the following help topics for more information:

- [How to Install DevExpress Products](/GeneralInformation/116042/installation/install-products)
- [Install Packages from NuGet.org: Visual Studio, VS Code, and JetBrains Rider](https://go.devexpress.com/DevExpress_NuGet_Documentation.aspx)

### Register AI Client

See the following help topic for information on required NuGet packages and system requirements: [Register an AI Client](/WPF/405223/ai-powered-extensions).

The following code snippet registers an Azure OpenAI client at application startup within the [AIExtensionsContainerDesktop](/CoreLibraries/DevExpress.AIIntegration.AIExtensionsContainerDesktop) container:

- C#
- VB.NET

<section id="tabpanel_-uorw8kNaQ_tabid-csharp" role="tabpanel" data-tab="tabid-csharp">
<pre><code data-code-links="{&quot;/ (DevExpress.AIIntegration)(?:;|$)/&quot;:&quot;/CoreLibraries/DevExpress.AIIntegration&quot;,&quot;/ (DevExpress.Xpf.Core)(?:;|$)/&quot;:&quot;/WPF/DevExpress.Xpf.Core&quot;,&quot;/ (System)(?:;|$)/&quot;:&quot;https://learn.microsoft.com/dotnet/api/system&quot;,&quot;/ (System.Windows)(?:;|$)/&quot;:&quot;https://learn.microsoft.com/dotnet/api/system.windows&quot;}" data-highlight-lines="[[19,22]]" class="lang-csharp">using Azure.AI.OpenAI;
using DevExpress.AIIntegration;
using DevExpress.Xpf.Core;
using Microsoft.Extensions.AI;
using System;
using System.Windows;

namespace AIAssistantApp {
    public partial class App : Application {
        static App() {
            CompatibilitySettings.UseLightweightThemes = true;
        }

        protected override void OnStartup(StartupEventArgs e) {
            base.OnStartup(e);
            ApplicationThemeHelper.ApplicationThemeName = &quot;Win11Light&quot;;

            // For example, ModelId = &quot;gpt-4o-mini&quot;
            IChatClient azureChatClient = new Azure.AI.OpenAI.AzureOpenAIClient(new Uri(AzureOpenAIEndpoint),
                new System.ClientModel.ApiKeyCredential(AzureOpenAIKey)).GetChatClient(ModelId).AsIChatClient();
            AIExtensionsContainerDesktop.Default.RegisterChatClient(azureChatClient);
        }
    }
}
</code></pre></section>
<section id="tabpanel_-uorw8kNaQ_tabid-vb" role="tabpanel" data-tab="tabid-vb" aria-hidden="true" hidden="hidden">
<pre><code data-code-links="{&quot;/ (DevExpress.AIIntegration)(?:;|$)/&quot;:&quot;/CoreLibraries/DevExpress.AIIntegration&quot;,&quot;/ (DevExpress.Xpf.Core)(?:;|$)/&quot;:&quot;/WPF/DevExpress.Xpf.Core&quot;,&quot;/ (System)(?:;|$)/&quot;:&quot;https://learn.microsoft.com/dotnet/api/system&quot;,&quot;/ (System.Windows)(?:;|$)/&quot;:&quot;https://learn.microsoft.com/dotnet/api/system.windows&quot;}" class="lang-vb">Imports Azure.AI.OpenAI
Imports DevExpress.AIIntegration
Imports DevExpress.Xpf.Core
Imports Microsoft.Extensions.AI
Imports System
Imports System.Windows

Namespace AIAssistantApp
    Partial Public Class App
        Inherits Application

        Shared Sub New()
            CompatibilitySettings.UseLightweightThemes = True
        End Sub

        Protected Overrides Sub OnStartup(ByVal e As StartupEventArgs)
            MyBase.OnStartup(e)
            ApplicationThemeHelper.ApplicationThemeName = &quot;Win11Light&quot;

            &#39; For example, ModelId = &quot;gpt-4o-mini&quot;
            Dim azureChatClient As IChatClient = New AzureOpenAIClient(New Uri(AzureOpenAIEndpoint), 
                New System.ClientModel.ApiKeyCredential(AzureOpenAIKey)).GetChatClient(ModelId).AsIChatClient()
            AIExtensionsContainerDesktop.Default.RegisterChatClient(azureChatClient)
        End Sub
    End Class
End Namespace
</code></pre></section>

### Attach Smart Search Behavior

Attach the [SmartSearchBehavior](/WPF/DevExpress.AIIntegration.Wpf.SmartSearchBehavior) to a control (Themed Window, Accordion Control).

Tip

You can also use a control’s smart tag menu to attach the `SmartSearchBehavior` at design time.

#### Example: Ribbon Control

The following code snippet attaches the `SmartSearchBehavior` to a Themed Window with the integrated Ribbon control:

- XAML

<section id="tabpanel_oiUayLZL4Z_tabid-xaml" role="tabpanel" data-tab="tabid-xaml">
<pre><code data-highlight-lines="[[6],[10],[12]]" class="lang-xaml">&lt;dx:ThemedWindow
    xmlns=&quot;http://schemas.microsoft.com/winfx/2006/xaml/presentation&quot;
    xmlns:x=&quot;http://schemas.microsoft.com/winfx/2006/xaml&quot;
    xmlns:dx=&quot;http://schemas.devexpress.com/winfx/2008/xaml/core&quot;
    xmlns:dxmvvm=&quot;http://schemas.devexpress.com/winfx/2008/xaml/mvvm&quot; 
    xmlns:dxai=&quot;http://schemas.devexpress.com/winfx/2008/xaml/ai&quot;
    xmlns:dxr=&quot;http://schemas.devexpress.com/winfx/2008/xaml/ribbon&quot;
    x:Class=&quot;DXSmartSearch.MainWindow&quot;
    Title=&quot;MainWindow&quot; Height=&quot;800&quot; Width=&quot;700&quot;
    WindowKind=&quot;Ribbon&quot; SearchItemDisplayMode=&quot;Right&quot; SearchDelay=&quot;300&quot;&gt;
    &lt;dxmvvm:Interaction.Behaviors&gt;
        &lt;dxai:SmartSearchBehavior&quot;/&gt;
    &lt;/dxmvvm:Interaction.Behaviors&gt;
    &lt;Grid x:Name=&quot;mainGrid&quot;&gt;
        &lt;dxr:RibbonControl x:Name=&quot;ribbonControl&quot; RibbonStyle=&quot;Office2019&quot;&gt;
            &lt;!--Ribbon configuration is omitted for brevity.--&gt;
        &lt;/dxr:RibbonControl&gt;
    &lt;/Grid&gt;
&lt;/dx:ThemedWindow&gt;
</code></pre></section>

Ribbon Control: Attach the Smart Search Behavior to a Themed Window in Code Behind
```
using DevExpress.AIIntegration.Wpf;
using DevExpress.Mvvm.UI.Interactivity;
using DevExpress.Xpf.Bars;
using DevExpress.Xpf.Core;
using System.Windows;

namespace DXSmartSearch {
    public partial class MainWindow : ThemedWindow {
        public MainWindow() {
            InitializeComponent();
            this.SearchItemDisplayMode = SearchItemDisplayMode.Right;
            this.SearchDelay = 300;
            SmartSearchBehavior behavior = new SmartSearchBehavior();
            Interaction.GetBehaviors(this).Add(behavior);
        }
    }
}
```

#### Example: Accordion Control

The following code snippet attaches the `SmartSearchBehavior` to an Accordion control:

- XAML

<section id="tabpanel_oiUayLZL4Z-1_tabid-xaml" role="tabpanel" data-tab="tabid-xaml">
<pre><code data-highlight-lines="[[6],[13],[15]]" class="lang-xaml">&lt;dx:ThemedWindow
    xmlns=&quot;http://schemas.microsoft.com/winfx/2006/xaml/presentation&quot;
    xmlns:x=&quot;http://schemas.microsoft.com/winfx/2006/xaml&quot;
    xmlns:dx=&quot;http://schemas.devexpress.com/winfx/2008/xaml/core&quot;
    xmlns:dxmvvm=&quot;http://schemas.devexpress.com/winfx/2008/xaml/mvvm&quot; 
    xmlns:dxai=&quot;http://schemas.devexpress.com/winfx/2008/xaml/ai&quot;
    xmlns:dxa=&quot;http://schemas.devexpress.com/winfx/2008/xaml/accordion&quot;
    x:Class=&quot;DXSmartSearch.MainWindow&quot;
    Title=&quot;MainWindow&quot; Height=&quot;800&quot; Width=&quot;700&quot;&gt;
    &lt;Grid x:Name=&quot;mainGrid&quot;&gt;
        &lt;dxa:AccordionControl x:Name=&quot;accordionControl&quot;
            HorizontalAlignment=&quot;Left&quot; VerticalAlignment=&quot;Top&quot; Width=&quot;180&quot; Height=&quot;300&quot;
            ShowSearchControl=&quot;True&quot;&gt;
            &lt;dxmvvm:Interaction.Behaviors&gt;
                &lt;dxai:SmartSearchBehavior /&gt;
            &lt;/dxmvvm:Interaction.Behaviors&gt;
            &lt;!--Accordion configuration is omitted for brevity.--&gt;
        &lt;/dxa:AccordionControl&gt;
    &lt;/Grid&gt;
&lt;/dx:ThemedWindow&gt;
</code></pre></section>

## SmartSearchBehavior APIs

In the context of Smart Search, an item refers to a [BarItem](/WPF/DevExpress.Xpf.Bars.BarItem) when working with a RibbonControl, or an [AccordionItem](/WPF/DevExpress.Xpf.Accordion.AccordionItem) when working with an AccordionControl.

### Item Descriptions

Item descriptions are optional if an item’s content or header/caption is specified (for example, `BarItem.Content` and `BarItem.Description` properties or accordion UI element’s `Header` property is set to a non-empty string). Although Smart Search attempts to find items based on their text, we recommend that you also describe items for improved accuracy.

Use the [ItemDescription](/WPF/DevExpress.AIIntegration.Wpf.SmartSearchBehavior.ItemDescription) attached property to add descriptions to certain items:

- XAML

<section id="tabpanel_oiUayLZL4Z-2_tabid-xaml" role="tabpanel" data-tab="tabid-xaml">
<pre><code data-highlight-lines="[[3]]" class="lang-xaml">&lt;dxr:RibbonPageGroup Caption=&quot;System Protection&quot;&gt;
    &lt;dxb:BarButtonItem Content=&quot;Enable Protection&quot;
        dxai:SmartSearchBehavior.ItemDescription=&quot;Activates software protection against unauthorized access.&quot; /&gt;
    &lt;dxb:BarButtonItem Content=&quot;Login&quot;
        dxai:SmartSearchBehavior.ItemDescription=&quot;Displays a sign-in or login form.&quot; /&gt;
        &lt;dxb:BarButtonItem Content=&quot;Settings&quot;
        dxai:SmartSearchBehavior.ItemDescription=&quot;Displays settings and options related to security and protection.&quot; /&gt;
&lt;/dxr:RibbonPageGroup&gt;
</code></pre></section>

### Excluded Items

Enable the [HideFromSearch](/WPF/DevExpress.Xpf.Bars.BarItemSearchSettings.HideFromSearch) option for items to exclude them from both regular and smart searches:

- XAML

<section id="tabpanel_oiUayLZL4Z-3_tabid-xaml" role="tabpanel" data-tab="tabid-xaml">
<pre><code class="lang-xaml">&lt;dxb:BarButtonItem Content=&quot;Help&quot; dxb:BarItemSearchSettings.HideFromSearch=&quot;True&quot; /&gt;
</code></pre></section>

## ThemedWindow Search Settings

The following table lists additional settings that allow you to customize search experience based on your preferences:

| Property Name | Description |
| --- | --- |
| [SearchItemDisplayMode](/WPF/DevExpress.Xpf.Core.ThemedWindow.SearchItemDisplayMode) | Specifies the visibility and position of the search box in a ThemedWindow. |
| [SearchDelay](/WPF/DevExpress.Xpf.Core.ThemedWindow.SearchDelay) | Specifies the delay (in milliseconds) before the search operation starts after the user stops typing in the search box of a ThemedWindow. |
| [SearchItemFocusShortcut](/WPF/DevExpress.Xpf.Core.ThemedWindow.SearchItemFocusShortcut) | Specifies the hotkey that focuses the search box in a ThemedWindow. |