HarryChen0506 / react-markdown-editor-lite

a light-weight Markdown editor based on React. 一款轻量的基于React的markdown编辑器
https://harrychen0506.github.io/react-markdown-editor-lite/
MIT License
1.02k stars 161 forks source link

Support for RTL #281

Closed munafio closed 1 year ago

munafio commented 1 year ago

is there an API or any plans to add support to RTL? for Arabic and other related languages direction?

sylingd commented 1 year ago

I'm happy to support RTL, but in fact, I don't know how to support RTL, include what should I do and how can I test it. I searched on MDN, but that didn't help much.

If you have more information, such as articles, codes, you can post them below.

munafio commented 1 year ago

@sylingd RTL is the editor's (or DOM elements) direction (Right To Left) for languages like (Arabic, Urdu...etc) .. In English, the direction starts from Left To Right (LTR) which is by default supported.

So the components should be on the opposite direction if it was RTL, as well as the text, toolbar items ...etc

I have tested the library, and found a solution to do it .. which is by putting the Editor component inside a wrapper div with the following stylings:

direction: rtl;
text-align:right;

or you can make it as a css class then set it to the wrapper div.

and now everything is working as expected for RTL direction.

sylingd commented 1 year ago

Thank you, I will support RTL in next version

munafio commented 1 year ago

@sylingd No, Thanks to you for your great work .. you already did support it because of the structure ..etc, only missing the thing I've mentioned above (direction stylings) which can be a boolean property (isRTL).