From 5602d3a3e427ebb53d557dabed0ec200154ed168 Mon Sep 17 00:00:00 2001 From: Mads Hargreave Date: Sat, 1 Apr 2017 16:02:55 +0700 Subject: [PATCH] Added `include` and `exclude` props to filter emoji categories --- README.md | 2 ++ src/components/picker.js | 6 ++++++ 2 files changed, 8 insertions(+) diff --git a/README.md b/README.md index 601f688..cbd5355 100644 --- a/README.md +++ b/README.md @@ -22,6 +22,8 @@ import { Picker } from 'emoji-mart' | ---- | :------: | ------- | ----------- | | **color** | | `#ae65c5` | The top bar anchors select and hover color | | **emoji** | | `department_store` | The emoji shown when no emojis are hovered | +| **include** | | `['People', 'Flags']` | Only load included categories | +| **exclude** | | `['Animals', 'Objects']` | Don't load excluded catagories | | **emojiSize** | | `24` | The emoji width and height | | **onClick** | | | Params: `(emoji, event) => {}` | | **perLine** | | `9` | Number of emojis per line. While there’s no minimum or maximum, this will affect the picker’s width. This will set *Frequently Used* length as well (`perLine * 4`) | diff --git a/src/components/picker.js b/src/components/picker.js index c878483..401ead7 100644 --- a/src/components/picker.js +++ b/src/components/picker.js @@ -43,6 +43,10 @@ export default class Picker extends React.Component { let filteredCategories = []; for (let hash of data.categories) { + let isIncluded = props.include == undefined ? true : props.include.indexOf(hash.name) > -1 + let isExcluded = props.exclude == undefined ? false : props.exclude.indexOf(hash.name) > -1 + if (!isIncluded || isExcluded) { continue; } + let new_emojis = []; for (let emoji of hash.emojis) { let unified = data.emojis[emoji].unified; @@ -348,6 +352,8 @@ Picker.propTypes = { backgroundImageFn: Emoji.propTypes.backgroundImageFn, sheetSize: Emoji.propTypes.sheetSize, emojisToShowFilter: React.PropTypes.func, + include: React.PropTypes.arrayOf(React.PropTypes.string), + exclude: React.PropTypes.arrayOf(React.PropTypes.string) } Picker.defaultProps = {