# emoji-picker A vendored third-party emoji picker (`emoji-picker-element`) with category browsing, search, and skin-tone selection. `EmojiPickerElement` (`static/js/EmojiPickerElement.js`) is the single wrapper that lazily loads the vendor module and builds a configured element; two consumers use it. The `EmojiPicker` wrapper inserts the chosen emoji at the cursor of textareas marked `.emoji-picker-target`, and the reaction bar opens it from the `+` button next to the quick-pick palette so any emoji can be used as a reaction. Source: `static/vendor/emoji-picker-element/`. ## Attributes | Attribute | Description | |---|---| | `locale` | Language for emoji labels (for example `en`). | | `skin-tone-emoji` | Default skin-tone emoji. | | `emoji-version` | Restrict to a Unicode emoji version. | ## Events | Event | Detail | |---|---| | `emoji-click` | `{ unicode, emoji, ... }` for the chosen emoji (primary event). | | `skin-tone-change` | The selected skin tone. | ## Usage ```html <emoji-picker></emoji-picker> ``` ```javascript picker.addEventListener("emoji-click", (event) => { insert(event.detail.unicode); }); ```
Live example - pick an emoji
No emoji selected yet.