dir="rtl" Not Working in react-native-render-html

[vasanshettiTharun]

Decision Table

• [x] My issue does not look like “The HTML attribute 'xxx' is ignored” (unless we claim support for it)
• [x] My issue does not look like “The HTML element <yyy> is not rendered”

Good Faith Declaration

• [x] I have read the HELP document here: https://git.io/JBi6R
• [x] I have read the CONTRIBUTING document here: https://git.io/JJ0Pg
• [x] I have confirmed that this bug has not been reported yet

Description

hen using react-native-render-html, the dir="rtl" attribute is not applied correctly to text elements. This is critical for rendering Arabic, Urdu, and Persian text properly in an RTL layout.

Expected Behavior: When dir="rtl" is set on a

or

element, the text should be right-aligned, and punctuation should behave correctly.

Actual Behavior: dir="rtl" is ignored.

Arabic/Urdu text appears incorrectly aligned.

English text inside an RTL block does not switch back to LTR automatically.

const generateHTML = `

بِسْمِ اللهِ الرَّحمنِ الرَّحِيم

امنیی ا ارحمالراحمنی ۔ Tumhara Rab Azzwajal Farmata Hai

`;

<RenderHTML contentWidth={width} source={{ html: generateHTML }} systemFonts={["Jameel Noori Nastaleeq", "1 MUHAMMADI QURANIC"]} defaultTextProps={{ selectable: true }} ignoredDomTags={['o:p']} />;

React Native Information

React Native: 0.78

Device: (Android and ios)

RNRH Version

react-native-render-html": "^6.3.4"

Tested Platforms

• [x] Android
• [x] iOS
• [ ] Web
• [ ] MacOS
• [ ] Windows

Reproduction Platforms

• [x] Android
• [x] iOS
• [ ] Web
• [ ] MacOS
• [ ] Windows

Minimal, Reproducible Example

https://snack.expo.dev/@aadhi007/587b6b?platform=android

Additional Notes

This bug affects all RTL languages and prevents proper text rendering.

[Prince-BITNET]

+1