search

missive / emoji-mart

🏪 One component to pick them all
https://missiveapp.com/open/emoji-mart
MIT License
8.69k stars 835 forks source link

No emojis displayed when selecting "apple", "facebook", "google", "twitter" sets #781

Open CompuWiser opened 1 year ago

CompuWiser commented 1 year ago

When I choose any set like "apple", "facebook", "google", "twitter" no emojis will be displayed Only the "native" option is working for me

image

You can see that the image sprite is loaded, but in the styling there is no "background-position" specified image

emoji-mart v5.5.1 React v17.0.2 Node v18.13.0 react-scripts v5.0.1

ghost commented 1 year ago

https://github.com/missive/emoji-mart/issues/612 solved it

Sidd-underscore commented 1 year ago

make sure you import the correct file: import data from '@emoji-mart/data/sets/14/apple.json'

construction `import data from '@emoji-mart/data/sets/{emoji version}/{set}.json

emoji versions supported: 1, 2, 3, 4, 5, 11, 12, 12.1, 13, 13.1, 14

CompuWiser commented 1 year ago

612 solved it

This should be mentioned in the docs

ZoiaBaletska commented 1 year ago

having the same issue with sets in Picker, import data from '@emoji-mart/data/sets/{emoji version}/{set}.json does not help.

import data from '@emoji-mart/data/sets/14/google.json';
import Picker from '@emoji-mart/react';

<Picker data={data}
   skin="1"
   onEmojiSelect={(emoji) => {
   return permissionForWrite
   ? selectNewEmoji(emoji)
   : () => {};
   }}
   set="google"
/>

emoji-mart v^5.5.2 React v18.2.0 Node v16.17.1 react-scripts v5.0.1

image

pkc918 commented 1 year ago

First of all，Make sure you have this JSON file in the node_modules directory

` import data from "@emoji-mart/data/sets/14/apple.json"; import Picker from "@emoji-mart/react";

<Picker data={ data } onEmojiSelect={ console.log } locale="zh" skin="1" set="apple"/> ` I didn't encounter any issues with the steps I took