# 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.