fix: auto-detect text direction for RTL/BiDi chat content

Refs #749
This commit is contained in:
Prakhar Pandey 2026-07-16 14:08:35 +05:30
parent b43dfaf14f
commit 63ed6e2dd6
4 changed files with 11 additions and 1 deletions

View file

@ -1445,3 +1445,10 @@
transform: translateX(-120%);
}
}
/* Issue #749: BiDi. unicode-bidi:plaintext resolves direction PER BLOCK from
its first strong character, so a message mixing English + RTL paragraphs
aligns each block correctly. text-align:start follows the resolved dir. */
.bidi-auto :is(p,h1,h2,h3,h4,h5,h6,li,blockquote,td,th){unicode-bidi:plaintext;text-align:start;}
/* Code is inherently LTR — keep it stable inside RTL messages. */
.bidi-auto :is(pre,code,kbd,samp){direction:ltr;unicode-bidi:isolate;text-align:left;}

View file

@ -94,6 +94,7 @@ export const AskHumanRequest = ({
<div className="space-y-2">
<Textarea
ref={textareaRef}
dir="auto"
value={response}
onChange={(e) => setResponse(e.target.value)}
onKeyDown={handleKeyDown}

View file

@ -349,7 +349,7 @@ export const MessageResponse = memo(
({ className, ...props }: MessageResponseProps) => (
<Streamdown
className={cn(
"size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0",
"size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0 bidi-auto",
className
)}
{...props}

View file

@ -1162,6 +1162,7 @@ export const PromptInputTextarea = ({
<div
ref={highlightRef}
aria-hidden="true"
dir="auto"
className="pointer-events-none absolute inset-0 z-0 overflow-hidden whitespace-pre-wrap break-words text-sm text-transparent"
>
{mentionHighlights.segments.map((segment, index) =>
@ -1180,6 +1181,7 @@ export const PromptInputTextarea = ({
)}
<InputGroupTextarea
ref={textareaRef}
dir="auto"
className={cn("relative z-10 !p-0 field-sizing-content max-h-48 min-h-10", className)}
name="message"
onCompositionEnd={() => setIsComposing(false)}