``` ```csharp private readonly BitAiConversation conversation = CreateConversation(); private static BitAiConversation CreateConversation() { var conversation = new BitAiConversation(); conversation.AddMessage(BitAiRole.User, "What is BitAiMessageList for?"); conversation.AddMessage(BitAiRole.Assistant, "It renders the **transcript** of a conversation: every message, laid out by role, in a column that scrolls."); conversation.AddMessage(BitAiRole.User, "Does it follow a streaming reply?"); conversation.AddMessage(BitAiRole.Assistant, "Only while you are at the bottom. Scroll up to re-read and it leaves you where you are."); return conversation; } ``` \n**Session**: ```razor @implements IAsyncDisposable

``` ```csharp // A transport that echoes the prompt, over a conversation that already has some history. private readonly BitAiChatSession session = new(AiDemoTransports.Echo(), CreateConversation()); private static BitAiConversation CreateConversation() { var conversation = new BitAiConversation(); conversation.AddMessage(BitAiRole.User, "What is BitAiMessageList for?"); conversation.AddMessage(BitAiRole.Assistant, "It renders the **transcript** of a conversation: every message, laid out by role, in a column that scrolls."); conversation.AddMessage(BitAiRole.User, "Does it follow a streaming reply?"); conversation.AddMessage(BitAiRole.Assistant, "Only while you are at the bottom. Scroll up to re-read and it leaves you where you are."); return conversation; } public ValueTask DisposeAsync() => session.DisposeAsync(); ``` \n**Templates**: ```razor @implements IAsyncDisposable

Today

Replies are scripted on this page.

``` ```csharp private readonly BitAiChatSession templatesSession = new(AiDemoTransports.Echo()); private readonly string[] suggestions = ["What can these components do?", "Show me streaming"]; private async Task AskTemplatesSession(string suggestion) { await templatesSession.SubmitAsync(suggestion); } public ValueTask DisposeAsync() => templatesSession.DisposeAsync(); ``` \n**Message template**: ```razor

@(message.Role.IsUser ? "You" : "Assistant") @message.GetText()

``` ```csharp // The template prints the text of a message as it is, so its conversation is written without Markdown. private readonly BitAiConversation templateConversation = CreateTemplateConversation(); private static BitAiConversation CreateTemplateConversation() { var conversation = new BitAiConversation(); conversation.AddMessage(BitAiRole.User, "What is BitAiMessageList for?"); conversation.AddMessage(BitAiRole.Assistant, "It renders the transcript of a conversation: every message, laid out by role, in a column that scrolls."); conversation.AddMessage(BitAiRole.User, "Can I draw the messages myself?"); conversation.AddMessage(BitAiRole.Assistant, "Yes: a MessageTemplate replaces how every message is drawn, like this compact log."); return conversation; } ``` \n**System messages**: ```razor

``` ```csharp private bool hideSystemMessages = true; private readonly BitAiConversation systemConversation = CreateSystemConversation(); private static BitAiConversation CreateSystemConversation() { var conversation = new BitAiConversation(); conversation.AddMessage(BitAiRole.System, "You are a concise assistant. Answer in one sentence."); conversation.AddMessage(BitAiRole.User, "What is a transcript?"); conversation.AddMessage(BitAiRole.Assistant, "The written record of a conversation, in the order it was said."); return conversation; } ``` \n**Following the latest**: ```razor @implements IAsyncDisposable

Following the newest message: @isPinned

``` ```csharp private BitAiMessageList? followList; private bool isPinned = true; // Null hands the registered options down unchanged, which follow new content (AutoScroll is on by default). private bool autoScroll = true; private readonly BitAiUiOptions manualScrollOptions = new() { AutoScroll = false }; // A transport that streams a long Markdown answer, over a conversation that already has some history. private readonly BitAiChatSession followSession = new(AiDemoTransports.Markdown(), AiDemoConversations.Long(12)); private void HandlePinnedChange(bool pinned) { isPinned = pinned; } private async Task ScrollToLatest() { if (followList is not null) await followList.ScrollToLatestAsync(); } public ValueTask DisposeAsync() => followSession.DisposeAsync(); ``` \n**Virtualization**: ```razor

``` ```csharp // Four hundred messages of prose, code, tables, tool calls and citations. private readonly BitAiConversation longConversation = AiDemoConversations.Long(400); ``` \n**Citations & feedback**: ```razor

Last event: @(lastEvent ?? "-")

``` ```csharp private string? lastEvent; private readonly BitAiConversation citedConversation = CreateCitedConversation(); private static BitAiConversation CreateCitedConversation() { var conversation = new BitAiConversation(); conversation.AddMessage(BitAiRole.User, "Where does an Interactive Server component keep its state?"); const string first = "On the server, for as long as the circuit lives."; const string second = " When the circuit drops, the state goes with it."; var reply = new BitAiMessage(BitAiRole.Assistant); reply.AddPart(new BitAiTextPart(first + second)); // Each citation is anchored to the span of the text it supports: its numbered chip goes at the end of it. reply.AddCitation(new BitAiCitation("c1", new BitAiCitationSource("s1", "Blazor render modes") { Kind = BitAiSourceKind.Web, SiteName = "Microsoft Learn", Url = "https://learn.microsoft.com/aspnet/core/blazor/components/render-modes", }) { StartIndex = 0, EndIndex = first.Length, }); reply.AddCitation(new BitAiCitation("c2", new BitAiCitationSource("s2", "SignalR circuit lifetime") { Kind = BitAiSourceKind.Document, SiteName = "Microsoft Learn", Url = "https://learn.microsoft.com/aspnet/core/blazor/fundamentals/signalr", }) { StartIndex = first.Length, EndIndex = first.Length + second.Length, }); conversation.AddMessage(reply); return conversation; } private void HandleCitationClick(BitAiCitation citation) { lastEvent = $"Citation [{citation.Number}] of \"{citation.Source.Title}\""; } private void HandleSourceClick(BitAiCitationSource source) { lastEvent = $"Source \"{source.Title}\" ({source.Url})"; } private void HandleFeedback(BitAiMessageFeedback feedback) { lastEvent = $"Feedback {feedback.Feedback} on message {feedback.Message.MessageId}"; } ``` \n**Disabled**: ```razor @implements IAsyncDisposable

``` ```csharp private bool isDisabled = true; private readonly BitAiChatSession disabledSession = new(AiDemoTransports.Echo(), CreateConversation()); private static BitAiConversation CreateConversation() { var conversation = new BitAiConversation(); conversation.AddMessage(BitAiRole.User, "What is BitAiMessageList for?"); conversation.AddMessage(BitAiRole.Assistant, "It renders the **transcript** of a conversation: every message, laid out by role, in a column that scrolls."); conversation.AddMessage(BitAiRole.User, "Does it follow a streaming reply?"); conversation.AddMessage(BitAiRole.Assistant, "Only while you are at the bottom. Scroll up to re-read and it leaves you where you are."); return conversation; } public ValueTask DisposeAsync() => disabledSession.DisposeAsync(); ``` \n**Cascading parameters**: ```razor

``` ```csharp private readonly BitAiMessageListParams[] listParams = [ new() { HideSystemMessages = false, Styles = new() { Root = "border:1px dashed var(--bit-clr-brd-pri);border-radius:0.5rem" }, } ]; private readonly BitAiConversation cascadeConversation = CreateSystemConversation(); private readonly BitAiConversation cascadeOwnConversation = CreateSystemConversation(); private static BitAiConversation CreateSystemConversation() { var conversation = new BitAiConversation(); conversation.AddMessage(BitAiRole.System, "You are a concise assistant. Answer in one sentence."); conversation.AddMessage(BitAiRole.User, "What is a transcript?"); conversation.AddMessage(BitAiRole.Assistant, "The written record of a conversation, in the order it was said."); return conversation; } ``` \n**Style & Class**: ```razor

``` ```csharp private readonly BitAiConversation styleConversation = CreateConversation(); private readonly BitAiConversation classConversation = CreateConversation(); private readonly BitAiConversation variablesConversation = CreateConversation(); private static BitAiConversation CreateConversation() { var conversation = new BitAiConversation(); conversation.AddMessage(BitAiRole.User, "What is BitAiMessageList for?"); conversation.AddMessage(BitAiRole.Assistant, "It renders the **transcript** of a conversation: every message, laid out by role, in a column that scrolls."); conversation.AddMessage(BitAiRole.User, "Does it follow a streaming reply?"); conversation.AddMessage(BitAiRole.Assistant, "Only while you are at the bottom. Scroll up to re-read and it leaves you where you are."); return conversation; } ``` \n**RTL**: ```razor

``` ```csharp private readonly BitAiConversation rtlConversation = CreateRtlConversation(); private static BitAiConversation CreateRtlConversation() { var conversation = new BitAiConversation(); conversation.AddMessage(BitAiRole.User, "این فهرست پیام‌ها برای چیست؟"); conversation.AddMessage(BitAiRole.Assistant, "متن کامل یک گفتگو را نشان می‌دهد: هر پیام به ترتیب، با چیدمان نقش خودش."); return conversation; } ```