BlazorChatMessage.Content Property

Returns the message content.

Namespace: DevExpress.AIIntegration.Blazor.Chat

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

NuGet Package: DevExpress.AIIntegration.Blazor.Chat

Declaration

public string Content { get; }

Property Value

Type	Description
String	The message content.

Remarks

Use the Content property to get the text content of the message.

You can use this property to specify message content when you use a MessageTemplate or MessageContentTemplate.

Razor

<DxAIChat CssClass="demo-chat">
    <MessageTemplate>
        <div class="@GetMessageClasses(context)">
            @if(context.Typing) {
                <span>Loading...</span>
            } else {
                <div class="demo-chat-content">
                    @context.Content
                </div>
            }
        </div>
    </MessageTemplate>
</DxAIChat>

@code {
    string GetMessageClasses(BlazorChatMessage message) {
        if(message.Role == ChatMessageRole.Assistant) {
            return "demo-chat-message demo-assistant-message";
        } else if(message.Role == ChatMessageRole.User) {
            return "demo-chat-message demo-user-message";
        } else if(message.Role == ChatMessageRole.Error) {
            return "demo-chat-message demo-error-message";
        }
        return "demo-chat-message";
    }
}

CSS

 .demo-chat {
    width: 100%;
    height: 400px;
}
     .demo-chat .demo-chat-message {
        padding: 10px;
        border-radius: 10px;
        width: calc(100% - 60px);
        box-shadow: 0px 2px 6px -2px;
    }
         .demo-chat .demo-chat-message.demo-assistant-message {
            background-color: rgba(76, 255, 0, 0.2);
            align-self: self-start;
        }
         .demo-chat .demo-chat-message.demo-user-message {
            background-color: #FFF;
            align-self: self-end;
        }
         .demo-chat .demo-chat-message.demo-error-message {
            background-color: rgb(255, 0, 0, 0.2);
            align-self: center;
        }

Run Demo: AI Chat - Rich Formatted Response View Example: AI Chat for Blazor - How to add DxAIChat component in Blazor, MAUI, WPF, and WinForms applications

Related GitHub Examples

The following code snippet (auto-collected from DevExpress Examples) contains a reference to the Content property.

Note

The algorithm used to collect these code examples remains a work in progress. Accordingly, the links and snippets below may produce inaccurate results. If you encounter an issue with code examples below, please use the feedback form on this page to report the issue.

C#

winforms-generate-skin-palettes-with-ai/CS/DevExpress.AI.WinForms.AIGeneratePalette/UI/GeneratePaletteDialog.cs#L80

List<BlazorChatMessage> list = saveMessages.ToList();
int index = list.FindIndex(x => x.Content == messageContent);
for(int i = list.Count - 1; i >= index; i--)