How to retrieve emoji data downloaded by Picker component ?

[1kvsn]

Hello,

I'm raising this as I was unable to find any issues answering this question.

I'm using Picker component. When user clicks, the emoji picker shows up in the UI.

I've not implemented any kind of lazy loading techniques to default Picker so I'm assuming it loads the emoji list during web app initial load phase or maybe it gets bundled during build. I'm not sure.

If I want to retrieve the list of emoji used by the Picker component, how do I achieve it ?

I don't want to install new package to get emoji list and I don't want to use CDN link to fetch new list when I know the Picker component was used elsewhere in the app and the emoji data is available to the app.

Thank you.

[EtienneLem]

If not initiated manually, data is indeed loaded from a CDN when you mount the picker for the first time. In order to use the data before mounting the component, you need to initialize the data manually. See example here: https://github.com/missive/emoji-mart#%EF%B8%8F%EF%B8%8F-headless-search. You can call init without any options, it will fetch the data on a CDN.

Once initiated, you can access Data:

import * as EmojiMart from 'emoji-mart'

(async function() {
  await EmojiMart.init()
  console.log(EmojiMart.Data)
})()

You can log EmojiMart in your dev tools when visiting https://missiveapp.com/open/emoji-mart to see what is available.