zurb / tribute

ES6 Native @mentions
https://zurb.github.io/tribute/example/
MIT License
2.03k stars 304 forks source link

Discussion about RTL support #449

Open jseminck opened 4 years ago

jseminck commented 4 years ago

Hello! Thanks again for such a great library, it was a breeze to implement it with our custom built wysiwyg. One of requirements for us is proper RTL support and I'm keen to make it work for this library! But I think I'll need some help or pointers where to look in the code in order to achieve this.

Actually, I tried in the example page by setting the direction: rtl; on the .tribute-demo-input element:

      .tribute-demo-input {
        direction: rtl;

The end result is actually already quite promising... though in my own implementation it didn't work like that 😬 The main issue seems to be that, even though the cursor is in the right place, the text following the selected @-mention user is showing on the right side of the inserted element.

rtl-support-tribute

I'm no RTL expert (yet) but a quick test on Facebook shows the behaviour is very similar (mixing hebrew and roman alphabet in this case)

rtl-support-facebook

If you have any pointers in which area to look for fixing this, that would be great. In the mean time I will educate myself on RTL behaviours as well.

gelisiso2 commented 4 years ago

you can use element as selecte template