ealush / emoji-picker-react

The most popular React Emoji Picker
https://ealush.com/emoji-picker-react/
MIT License
991 stars 166 forks source link

CSS being appended into the document eventhough Picker rendered in Shadow DOM #392

Open ugurkellecioglu opened 5 months ago

ugurkellecioglu commented 5 months ago

Hi there!

Thanks for this beautiful package :) I'm trying to use this package inside of an chrome extension. Meaning that a script that runs on a page, initializes emoji picker in a Shadow DOM.

Unfortunately the CSS of emoji picker appended into the document header.

Can we add a property so that Emoji Picker takes an optional parameter of HTMLElement, a reference, so that css will be appended there.

This would probably fix the issue :)

For now, after I initialize EmojiPicker, I will look for the style id="flairup-epr" and paste it into my shadow dom manually.

Thanks, Ugur

ealush commented 5 months ago

Hey @ugurkellecioglu, thanks for reaching out!

I think 4.7.11 should sort that out for you. Instead of storing the style tag in the head, it is now applied right next to the picker's root element:

image