Make it easy to insert emojis

[azul]

Is your feature request related to a problem? Please describe.
I'm always frustrated when I want to add an emoji to a text. I need to find some emoji website, pick the one i like, copy and paste it.

Describe the solution you'd like
I'd like an easy way to pick an emoji to insert it into the text.
Currently I imagine another button in the menu bar that opens the emoji selector.
Picking an emoji from the selector would insert it into the text at the location of the cursor.

Describe alternatives you've considered
Opening the emoji selector when starting an emoji shortcut with : like github supports it.
Emoji button in the menubar seems more accessible and more consistent with what exist so far.
In contrast to github the editor currently has little support for typing magic like @ mentions.

Additional context
The Nextcloud Vue components have a nice emoji picker already.

[juliusknorr]

A shortcut like : would definitely be nice, but for the ease of keeping the implementation simple I'd stick with the proposed addition button in the toolbar for now. What do you think @nextcloud/designers is that to present?

[jancborchardt]

Both sounds good – let’s start with the action menu addition of the menu icon, and as a second step we can look into the : shortcut. :)

[mejo-]

Ok, so I couldn't resist and started playing around with adding shortcuts for inserting emojis via keyboard (using tiptap input rules). That's something I personally miss way more than the emoji picker 😉

The implementation is just a rough prototype for now and I'd like to get emoji picker (PR #1707) settled in text first, but still I wanted to share a screencast with you so that you can give early feedback on the design/concept: