fix(rtl): isolate Latin address text ("Name <email>") from RTL bidi reordering
Unicode's bidi algorithm treats < and > as mirrored characters. When a plain "Name <email>" string is rendered as a text node inside an RTL-inherited container, the browser swaps and reorders those brackets for the whole run, producing garbled output (e.g. "<Maria Lopez <maria.lopez@company.example" instead of "Maria Lopez <maria.lopez@company.example>"). Wrapped the affected text in native <bdi>, which auto-detects its own paragraph direction from its content rather than inheriting the ancestor's - so a Latin address renders LTR and a genuinely Arabic/Hebrew/Farsi name still renders RTL, both correctly, in: - recipient-popover.tsx (shared by the email viewer's From/To/Cc/Bcc detail rows and the calendar invitation banner's organizer row) - email-composer.tsx's read-only From display - eml-preview.tsx's From/To header lines Left the equivalent <select><option> cases (composer identity picker, template identity picker) and the composer's quote-header text (which becomes actual email body content, already isolated per-paragraph by the existing TextDirection tiptap extension) out of scope - both need a different fix approach than <bdi>.
This commit is contained in:
@@ -2217,11 +2217,11 @@ export function EmailComposer({
|
||||
{generateSubAddress(primaryIdentity?.email || '', subAddressTag, subAddressDelimiter)}
|
||||
</span>
|
||||
) : (
|
||||
<>
|
||||
<bdi>
|
||||
{primaryIdentity?.name
|
||||
? `${primaryIdentity.name} <${primaryIdentity.email}>`
|
||||
: primaryIdentity?.email || ''}
|
||||
</>
|
||||
</bdi>
|
||||
)}
|
||||
</span>
|
||||
)}
|
||||
|
||||
@@ -135,7 +135,7 @@ export function RecipientPopover({ name, email, displayLabel, onViewContact, cla
|
||||
className
|
||||
)}
|
||||
>
|
||||
{displayLabel || name || email}
|
||||
<bdi>{displayLabel || name || email}</bdi>
|
||||
</button>
|
||||
|
||||
{isOpen &&
|
||||
|
||||
Reference in New Issue
Block a user