Added `include` and `exclude` props to filter emoji categories

release
Mads Hargreave 2017-04-01 16:02:55 +07:00
parent 9a713ad885
commit 5602d3a3e4
2 changed files with 8 additions and 0 deletions

View File

@ -22,6 +22,8 @@ import { Picker } from 'emoji-mart'
| ---- | :------: | ------- | ----------- | | ---- | :------: | ------- | ----------- |
| **color** | | `#ae65c5` | The top bar anchors select and hover color | | **color** | | `#ae65c5` | The top bar anchors select and hover color |
| **emoji** | | `department_store` | The emoji shown when no emojis are hovered | | **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 | | **emojiSize** | | `24` | The emoji width and height |
| **onClick** | | | Params: `(emoji, event) => {}` | | **onClick** | | | Params: `(emoji, event) => {}` |
| **perLine** | | `9` | Number of emojis per line. While theres no minimum or maximum, this will affect the pickers width. This will set *Frequently Used* length as well (`perLine * 4`) | | **perLine** | | `9` | Number of emojis per line. While theres no minimum or maximum, this will affect the pickers width. This will set *Frequently Used* length as well (`perLine * 4`) |

View File

@ -43,6 +43,10 @@ export default class Picker extends React.Component {
let filteredCategories = []; let filteredCategories = [];
for (let hash of data.categories) { 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 = []; let new_emojis = [];
for (let emoji of hash.emojis) { for (let emoji of hash.emojis) {
let unified = data.emojis[emoji].unified; let unified = data.emojis[emoji].unified;
@ -348,6 +352,8 @@ Picker.propTypes = {
backgroundImageFn: Emoji.propTypes.backgroundImageFn, backgroundImageFn: Emoji.propTypes.backgroundImageFn,
sheetSize: Emoji.propTypes.sheetSize, sheetSize: Emoji.propTypes.sheetSize,
emojisToShowFilter: React.PropTypes.func, emojisToShowFilter: React.PropTypes.func,
include: React.PropTypes.arrayOf(React.PropTypes.string),
exclude: React.PropTypes.arrayOf(React.PropTypes.string)
} }
Picker.defaultProps = { Picker.defaultProps = {