search

webscopeio / react-textarea-autocomplete

📝 React component implements configurable GitHub's like textarea autocomplete.
MIT License
454 stars 80 forks source link

Including Trigger in selection output breaks functionality #84

Closed audiolion closed 6 years ago

audiolion commented 6 years ago

Hello 👋 ,

If you have a trigger like @ which opens up a list of users to select from, and the output is @audiolion, if you try to do another @ in the same textarea and select @webscopeio, the selection will replace the first @audiolion with @webscopeio instead of inserting the new autocomplete.

Seems fairly obvious that it looks for the first occurrence of the trigger in the document and replaces instead of maintaining the current selection of where the trigger occurred and replacing it there.

jukben commented 6 years ago

Hi! 👋 Thanks for the bug report, could you please create repro demo (you can use this pen as a start https://codepen.io/jukben/pen/bYZqvR)? Ideally, with described actual and expected behavior. I'm not sure if I understood it correctly, but I haven't been able to reproduce it.

audiolion commented 6 years ago

@jukben oh man, awesome codepen starter, here is a repro: https://codepen.io/yankasuto/pen/WgyObR

Try inserting two autocompletes in a row and you will see it happen

My apologies, you have to have "allowWhitespace: true" for the bug to occur.

jukben commented 6 years ago

Great! I see, that's actually a feature because allowWhitespace: true, why do you event need it?

allowWhitespace is there for a reason if your tokens are with a space, so you want to replace all the occurrences no matter whitespaces.

audiolion commented 6 years ago

Ok I made a gif of using the codepen, you are saying this is the intended behavior:

If it is then you can close this issue. To me it makes it so you can never have more than one autocomplete in the same text area with allowWhitespace: true. E.g.

Hello [contact first name], you will receive a letter addressed to [contact first name] [contact last name]

^ this scenario wouldn't work with the above codepen.

jukben commented 6 years ago

Oh, I see, that's definitely buggy. I mean, the best you can do is to avoid allowWhitespace at all, but since it's there I will do my best to fix it.

rta_fix_whitespace

This looks fine, don't you say?

audiolion commented 6 years ago

Yeah I actually am avoiding allowWhitespace currently. That fix looks good!