LinkedIn lookalike hashtagging

[kalemi19]

I'm trying to replicate how hashtag suggestions appear on LinkedIn using react-mentions, but can't seem to get it to work, nor sure if it's even possible.

Basically LinkedIn highlights the hashtag as you type, regardless if you choose one from the suggestions or not. You can also hit the backspace button without deleting the whole hashtag.

This is my setup based on some threads I read here.

<Mention
     trigger="#"
     markup="#__id__"
     regex={/#(\S+)/}
     data={[{
       id: 'covid19',
       display: 'covid19',
     },{
       id: 'covidsafe',
       display: 'covidsafe',
     }]}
     appendSpaceOnAdd
     style={{ color: colorPalette.secondary, zIndex: 1, position: 'relative' }}
     displayTransform={(id, display) => `#${display}`}
     renderSuggestion={suggestion => Mentions.renderHashtagsSuggestion(suggestion)}
   />

Unfortunately the suggestions go away as soon as I type #c, it gets highlighted and if I press backspace, the whole thing gets deleted.

I'm using v3.0.2

[alDoner]

You can also hit the backspace button without deleting the whole hashtag.

I agree with this. Is there any way to achieve this kind of behavior?