From c35900888f045d9b0fbc0912843b74a0b00fb6a6 Mon Sep 17 00:00:00 2001
From: weishu <twsxtd@gmail.com>
Date: Fri, 19 Dec 2025 21:18:42 +0800
Subject: [PATCH] fix(web): render system messages without
 MessagePrimitive.Root

https://github.com/assistant-ui/assistant-ui/issues/2954
---
 web/src/components/AssistantChat/messages/SystemMessage.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/web/src/components/AssistantChat/messages/SystemMessage.tsx b/web/src/components/AssistantChat/messages/SystemMessage.tsx
index ad784105..2f6851eb 100644
--- a/web/src/components/AssistantChat/messages/SystemMessage.tsx
+++ b/web/src/components/AssistantChat/messages/SystemMessage.tsx
@@ -1,4 +1,4 @@
-import { MessagePrimitive, useAssistantState } from '@assistant-ui/react'
+import { useAssistantState } from '@assistant-ui/react'
 import { getEventPresentation } from '@/chat/presentation'
 import type { HappyChatMessageMetadata } from '@/lib/assistant-runtime'
 
@@ -12,13 +12,13 @@ export function HappySystemMessage() {
     const icon = event ? getEventPresentation(event).icon : null
 
     return (
-        <MessagePrimitive.Root className="py-1">
+        <div className="py-1">
             <div className="mx-auto w-fit max-w-[92%] px-2 text-center text-xs text-[var(--app-hint)] opacity-80">
                 <span className="inline-flex items-center gap-1">
                     {icon ? <span aria-hidden="true">{icon}</span> : null}
                     <span>{text}</span>
                 </span>
             </div>
-        </MessagePrimitive.Root>
+        </div>
     )
 }