search

signavio / react-mentions

@mention people in a textarea
https://react-mentions.vercel.app
Other
2.4k stars 560 forks source link

Styling the display text will also render the default text (2 overlapping versions of the text is displayed) #708

Open dmdum opened 11 months ago

dmdum commented 11 months ago

Steps to reproduce:

  1. Visit this sample link
  2. Mention any of the mention options.

Expected behaviour: Only 1 version should be displayed. It should be the styled version.

Observed behaviour: 2 Overlapping versions are displayed. The default and the styled version. image

Workaround: None so far

JoacoBert commented 11 months ago

Hi, I have the same problem. Did you find any solution?

dmdum commented 11 months ago

Hi, I have the same problem. Did you find any solution?

I've removed the styling for now. Try adding a z-index on the styles to cover the original. It doesn't completely work for me because the styled text still isn't on the same level as the original so it can't cover it completely, but maybe it will for you.

JoacoBert commented 11 months ago

Thanks for your answer. I tried different ways but got no results. In the case of finding the solution I will let you know, and if you find it I hope you can let me know.

dmdum commented 11 months ago

I'll definitely share it here. Thanks!

kumarajay0412 commented 10 months ago

you can try to make on layer transparent it worked for me i am using js styles given in examples and by making one layer transparent you achieve the result use styles

https://github.com/signavio/react-mentions/blob/master/demo/src/examples/defaultStyle.js