mirror of
https://github.com/NousResearch/hermes-agent.git
synced 2026-06-14 09:11:54 +00:00
feat(desktop): auto-detect RTL/bidi text direction in chat
Arabic/Hebrew/Persian/Urdu chat text rendered left-to-right and left-aligned, and mixed RTL/English technical messages (the common case) read backwards. Resolve each chat block's base direction from its own first strong character (UAX#9) with pure CSS, scoped to the chat surfaces only: - `unicode-bidi: plaintext` + `text-align: start` on assistant prose blocks (p, h1-h6, li, blockquote), the user bubble's text lines, and both composers (main + edit share the composer-rich-input slot). RTL blocks read and right-align RTL; English stays LTR; mixed conversations resolve per block. `text-align: start` is required because the user bubble hardcodes `text-left`. - Inline `code` and KaTeX are pinned `direction: ltr; unicode-bidi: isolate`, so the bidi first-strong heuristic skips them: a sentence that *starts* with a command (`./run.sh ...`) followed by Arabic still resolves RTL, and the command's own neutrals keep their order. - Fenced code surfaces (code-card, user fences) are pinned LTR so they never mirror or right-align inside an RTL list item or blockquote. `direction` is never forced, so app chrome, layout, and list indent stay LTR per the issue's request not to flip the whole UI. English-only content is byte-for-byte unchanged. Salvaged and unified from #44065 and #44169; verified in Chromium that isolate removes inline code from the paragraph direction vote (the code-first case), making the JS dir-resolution in #44065 unnecessary. Fixes #44150 Co-authored-by: Adolanium <Adolanium@users.noreply.github.com> Co-authored-by: Adalsteinn Helgason <AIalliAI@users.noreply.github.com>
This commit is contained in:
parent
9e484f052a
commit
6c00077d38
2 changed files with 34 additions and 1 deletions
|
|
@ -127,7 +127,9 @@ const InlineSegmentView: FC<{ text: string }> = ({ text }) => {
|
|||
const nodes = useMemo(() => splitInlineCode(text), [text])
|
||||
|
||||
return (
|
||||
<span className="wrap-anywhere block whitespace-pre-line">
|
||||
// styles.css bidi hook (#44150); whitespace-pre-line makes each line its own
|
||||
// UAX#9 paragraph so it resolves direction independently.
|
||||
<span className="wrap-anywhere block whitespace-pre-line" data-slot="aui_user-inline-text">
|
||||
{nodes.map((node, nodeIndex) =>
|
||||
node.kind === 'inline-code' ? (
|
||||
<code
|
||||
|
|
|
|||
|
|
@ -823,6 +823,37 @@ canvas {
|
|||
content's --message-text-indent). No extra prose indent — a single gutter
|
||||
reads cleaner than a ragged tool-vs-reply column. */
|
||||
|
||||
/* RTL/bidi chat text (#44150): each block resolves its own base direction from
|
||||
its first strong char (UAX#9 plaintext). text-align:start makes that resolved
|
||||
direction drive alignment too — load-bearing, since the user bubble pins
|
||||
text-left. direction is never set, so chrome/layout/list-indent stay LTR (the
|
||||
issue asks not to flip the whole UI). Covers assistant prose, user lines, and
|
||||
both composers (main + edit share composer-rich-input). */
|
||||
[data-slot='aui_assistant-message-content'] .aui-md :where(p, h1, h2, h3, h4, h5, h6, li, blockquote),
|
||||
[data-slot='aui_user-inline-text'],
|
||||
[data-slot='composer-rich-input'] {
|
||||
unicode-bidi: plaintext;
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
/* Inline code/KaTeX don't vote on direction and keep their own order: isolate
|
||||
makes bidi treat each as one neutral, so a block that *starts* with `./run.sh`
|
||||
then Arabic still resolves RTL, and the command's neutrals (dots/slashes)
|
||||
aren't reordered by the surrounding RTL run. */
|
||||
[data-slot='aui_assistant-message-content'] .aui-md :where(:not(pre) > code),
|
||||
[data-slot='aui_user-inline-code'],
|
||||
[data-slot='aui_assistant-message-content'] .aui-md .katex {
|
||||
direction: ltr;
|
||||
unicode-bidi: isolate;
|
||||
}
|
||||
|
||||
/* Fenced code stays LTR even inside an RTL list item/blockquote — never mirrors. */
|
||||
[data-slot='aui_assistant-message-content'] .aui-md [data-slot='code-card'],
|
||||
[data-slot='aui_user-fence'] {
|
||||
direction: ltr;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
[data-slot='aui_user-message-root'] {
|
||||
top: var(--sticky-human-top);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue