IPromptSuggestion Interface

Defines prompt suggestion settings.

Namespace : DevExpress.AIIntegration.Blazor.Chat

Assembly : DevExpress.AIIntegration.Blazor.Chat.v25.2.dll

NuGet Package : DevExpress.AIIntegration.Blazor.Chat

Declaration

csharp

public interface IPromptSuggestion

Remarks

DevExpress Blazor AI Chat supports prompt suggestions – hints that guide users to possible actions. The component displays prompt suggestions (hint bubbles) when the chat area is empty.

Follow the steps below to enable and configure prompt suggestions:

Populate the component’s PromptSuggestions property with DxAIChatPromptSuggestion objects (hint bubbles).
Specify bubble content using Title and Text properties.
Use the PromptMessage property to specify the text to be displayed in the input field after a user clicks the corresponding suggestion.

Run Demo: AI Chat – Prompt Suggestions

Use the PromptSuggestionContentTemplate property to display any render fragment in a prompt suggestion (hint bubble). This template does not affect the default bubble rendering, such as paddings or inner content alignment.

Razor
CSS

razor

<DxAIChat Initialized="ChatInitialized">
    <PromptSuggestionContentTemplate>
        <div class="hint-bubble">
            @context.Title
        </div>
    </PromptSuggestionContentTemplate>
    <PromptSuggestions>
        @foreach (var suggestion in PromptSuggestions) {
            <DxAIChatPromptSuggestion Title="@suggestion.Title" Text="@suggestion.Text" PromptMessage="@suggestion.PromptMessage" />
        }
    </PromptSuggestions>
</DxAIChat>

@code {
    List<PromptSuggestion> PromptSuggestions { get; set; }

    void ChatInitialized() {
        PromptSuggestions = PromptSuggestionsDataProvider.GetData();
    }
}

css

.hint-bubble {
    font: normal bold 16px/2 cursive;
    font-variant-caps: all-small-caps;
}

For additional information about prompt suggestions in Blazor AI Chat, refer to the following section: AI Chat - Prompt Suggestions.