From f5ca46f7a471e72309cca93830576a7592587976 Mon Sep 17 00:00:00 2001
From: amr-9 <amr777h@gmail.com>
Date: Sat, 2 May 2026 21:40:57 +0300
Subject: [PATCH] Set dir="auto" on text containers

Add dir="auto" to key text-rendering elements to enable automatic text-direction detection for multilingual and bidirectional content. Applied to the prompt input (contenteditable), the Markdown root container, and the user message text slot to improve handling of RTL/LTR text and user-entered content.
---
 packages/app/src/components/prompt-input.tsx | 1 +
 packages/ui/src/components/markdown.tsx      | 1 +
 packages/ui/src/components/message-part.tsx  | 2 +-
 3 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/app/src/components/prompt-input.tsx b/packages/app/src/components/prompt-input.tsx
index 0a18096164f0..eb02d49f4cee 100644
--- a/packages/app/src/components/prompt-input.tsx
+++ b/packages/app/src/components/prompt-input.tsx
@@ -1344,6 +1344,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
               aria-multiline="true"
               aria-label={placeholder()}
               contenteditable="true"
+              dir="auto"
               autocapitalize={store.mode === "normal" ? "sentences" : "off"}
               autocorrect={store.mode === "normal" ? "on" : "off"}
               spellcheck={store.mode === "normal"}
diff --git a/packages/ui/src/components/markdown.tsx b/packages/ui/src/components/markdown.tsx
index 56e2d9d7094f..57c4b56df81a 100644
--- a/packages/ui/src/components/markdown.tsx
+++ b/packages/ui/src/components/markdown.tsx
@@ -337,6 +337,7 @@ export function Markdown(
   return (
     <div
       data-component="markdown"
+      dir="auto"
       classList={{
         ...local.classList,
         [local.class ?? ""]: !!local.class,
diff --git a/packages/ui/src/components/message-part.tsx b/packages/ui/src/components/message-part.tsx
index cc046fdfc577..8e7771c9fb49 100644
--- a/packages/ui/src/components/message-part.tsx
+++ b/packages/ui/src/components/message-part.tsx
@@ -1100,7 +1100,7 @@ export function UserMessageDisplay(props: { message: UserMessage; parts: PartTyp
       <Show when={text()}>
         <>
           <div data-slot="user-message-body">
-            <div data-slot="user-message-text">
+            <div data-slot="user-message-text" dir="auto">
               <HighlightedText text={text()} references={inlineFiles()} agents={agents()} />
             </div>
           </div>