Back to Devexpress

DxAIChat.PromptSuggestions Property

blazor-devexpress-dot-aiintegration-dot-blazor-dot-chat-dot-dxaichat-d260b5d3.md

latest3.9 KB
Original Source

DxAIChat.PromptSuggestions Property

Specifies the collection of prompt suggestions (hint bubbles).

Namespace : DevExpress.AIIntegration.Blazor.Chat

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

NuGet Package : DevExpress.AIIntegration.Blazor.Chat

Declaration

csharp
[Parameter]
public RenderFragment PromptSuggestions { get; set; }

Property Value

TypeDescription
RenderFragment

A collection of prompt suggestions (UI fragments).

|

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:

  1. Populate the component’s PromptSuggestions property with DxAIChatPromptSuggestion objects (hint bubbles).
  2. Specify bubble content using Title and Text properties.
  3. 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

razor
@using DevExpress.AIIntegration.Blazor.Chat

<DxAIChat Initialized="ChatInitialized">
    <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 = GetData();
    }
}
csharp
public List<PromptSuggestion> GetData() {
    return new List<PromptSuggestion>() {
        new PromptSuggestion("Tell me a joke", "Take a break and enjoy a quick laugh", "Tell me a joke."),
        new PromptSuggestion("Summarize text", "Extract a quick summary (main ideas)", "Summarize the following text:"),
        new PromptSuggestion("Write an email", "Make your text look and sound professional", "Format text as a formal email to a client:"),
        new PromptSuggestion("Brainstorm ideas", "Get creative input for your tasks", "Help me brainstorm ideas for:"),
        new PromptSuggestion("Fix my writing", "Avoid spelling, grammar, and style errors", "Proofread the following text:"),
    };
}
public class PromptSuggestion {
    public string Title { get; set; }
    public string Text { get; set; }
    public string PromptMessage { get; set; }
    public PromptSuggestion (string title, string text, string promptMessage) {
        Title = title;
        Text = text;
        PromptMessage = promptMessage;
    }
}

See Also

DxAIChat Class

DxAIChat Members

DevExpress.AIIntegration.Blazor.Chat Namespace