From ff1e2378ded7eef7ed4c5530dc31cb78be6d188d Mon Sep 17 00:00:00 2001
From: EfeDurmaz16 <efebarandurmaz05@gmail.com>
Date: Fri, 15 May 2026 13:30:24 +0300
Subject: [PATCH] fix(message): preserve sticky descendants

---
 packages/elements/__tests__/message.test.tsx | 7 +++++++
 packages/elements/src/message.tsx            | 2 +-
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/elements/__tests__/message.test.tsx b/packages/elements/__tests__/message.test.tsx
index a6d8a89a..d371e4e8 100644
--- a/packages/elements/__tests__/message.test.tsx
+++ b/packages/elements/__tests__/message.test.tsx
@@ -71,6 +71,13 @@ describe("messageContent", () => {
     );
     expect(container.firstChild).toHaveClass("custom");
   });
+
+  it("clips horizontal overflow without hiding sticky descendants", () => {
+    const { container } = render(<MessageContent>Text</MessageContent>);
+
+    expect(container.firstChild).toHaveClass("overflow-x-clip");
+    expect(container.firstChild).not.toHaveClass("overflow-hidden");
+  });
 });
 
 describe("messageActions", () => {
diff --git a/packages/elements/src/message.tsx b/packages/elements/src/message.tsx
index c04a3993..423d2c35 100644
--- a/packages/elements/src/message.tsx
+++ b/packages/elements/src/message.tsx
@@ -54,7 +54,7 @@ export const MessageContent = ({
 }: MessageContentProps) => (
   <div
     className={cn(
-      "is-user:dark flex w-fit min-w-0 max-w-full flex-col gap-2 overflow-hidden text-sm",
+      "is-user:dark flex w-fit min-w-0 max-w-full flex-col gap-2 overflow-x-clip text-sm",
       "group-[.is-user]:ml-auto group-[.is-user]:rounded-lg group-[.is-user]:bg-secondary group-[.is-user]:px-4 group-[.is-user]:py-3 group-[.is-user]:text-foreground",
       "group-[.is-assistant]:text-foreground",
       className