Skip to content

Conversation

@mlegrosfigma
Copy link
Collaborator

@mlegrosfigma mlegrosfigma commented Dec 17, 2025

Description

There are 3 main pain points in the current EmojiMart that this PR addressed ::

  1. Keywords Support: Right now this repo does not support keywords for searching. The data format does not use them, and the config.js file does not leverage them in the search function
  2. Custom Data: There's no way for the caller of this EmojiMart to specify a custom data set to be used.
  3. Custom Recents: If the caller wants to override the "recents" with a custom algo / impl there's no way to do that.

This PR addresses both of these.

Implementation Details

Custom Data
This is an optional property that may be passed in. If it's available; we parse it. If not; behavior should be the same as before.

Keyword Support
Keywords are allowed to be attached to the Emoji Entries in data. If the property present; we'll use them. If not; we'll default to an empty list

Searching keywords is added on top of this "empty-list-default" variable.

Custom Recents
This PR adds a prop that can override which emoji's fill the recents. If present, we override the internal getter. Otherwise; behavior should be unchanged.

@mlegrosfigma mlegrosfigma marked this pull request as ready for review January 12, 2026 22:33
Copy link

@iepstein-figma iepstein-figma left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall, this feels like a reasonable approach. I think the only change I'd very lightly recommend (defer to your judgement), would be to extract the frequently used emoji logic to its own function to clean up the _init() function a bit.

So something like:

function getFrequentlyUsedEmojis(overrides, pickerProps) {
  // does the logic to determine what the emojis should be and returns those
  returns frequentlyUsedEmojis
}

And then in _init, it'd look like:

const emojis = getFrequentlyUsedEmojis(props.frequentEmojisOverride, pickerProps)
if (emojis.length) {
  Data.categories.unshift({
    id: 'frequent',
    emojis,
  })
}

I think this isolates the logic into a nice logical block. But it's a soft recommendation.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants