Emoji picker

The emoji picker component provides a user with a default selection of emojis to choose from. An onSelect function will be called whenever an emoji is selected from the picker.

A footer may optionally be added to an emoji picker by passing the showFooter property. The footer includes a color picker to customize the skin tone of relevant emojis.

Other sets of emojis can be used within the emoji picker by providing custom sets to the wrapping EmojiContext.Provider. Sets can also be filtered to exclude certain categories of emojis. In the following demo, all emojis under the flags and nature categories are excluded from the picker.