signavio / react-mentions

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

Default markup regex breaks when entering `@[` #744

Open JefHellemansBlockbax opened 3 months ago

JefHellemansBlockbax commented 3 months ago

Comments: This is probably not something that is going to happen frequently, but I came across it while debugging our own implementation which has a simpler markup ({{__id__:__display__}}). For that markup, with {{ as trigger, the default regex breaks whenever another mention comes after it, even when just typing the trigger. Turns out this behaviour also occurs for the default markup and regex, although it's less obvious.

Steps to reproduce:

  1. Go to https://react-mentions.vercel.app/.
  2. In the very first input box, put your cursor at the beginning (before Hi John Doe,).
  3. Type @, the search box appears.
  4. Type [.

Expected behaviour: The results in the search box are updated. Likely nothing will match, but that should be fine.

Observed behaviour: The new mention gets combined with the one that comes after it (in this case John Doe), and the search box disappears. Any text that was in between is now part of the mention as well.

Workaround: Use a different regex. I haven't thought about a solution for the default one, but will be writing one for our own implementation.