diff --git a/README.md b/README.md index 8c85c89..16b5f27 100644 --- a/README.md +++ b/README.md @@ -50,6 +50,7 @@ import { Picker } from 'emoji-mart' | **defaultSkin** | | `1` | Default skin color: `1, 2, 3, 4, 5, 6` | | **style** | | | Inline styles applied to the root element. Useful for positioning | | **title** | | `Emoji Martâ„¢` | The title shown when no emojis are hovered | +| **notFoundEmoji** | | `sleuth_or_spy` | The emoji shown when there are no search results | | **notFound** | | | [Not Found](#not-found) | #### I18n diff --git a/src/components/category.js b/src/components/category.js index ff5b4f6..dccf99e 100644 --- a/src/components/category.js +++ b/src/components/category.js @@ -151,6 +151,7 @@ export default class Category extends React.Component { emojiProps, i18n, notFound, + notFoundEmoji, } = this.props, emojis = this.getEmojis(), labelStyles = {}, @@ -199,6 +200,7 @@ export default class Category extends React.Component { @@ -217,6 +219,7 @@ Category.propTypes = { emojiProps: PropTypes.object.isRequired, recent: PropTypes.arrayOf(PropTypes.string), notFound: PropTypes.func, + notFoundEmoji: PropTypes.string.isRequired, } Category.defaultProps = { diff --git a/src/components/not-found.js b/src/components/not-found.js index 9c51297..7ffda01 100644 --- a/src/components/not-found.js +++ b/src/components/not-found.js @@ -4,7 +4,7 @@ import { NimbleEmoji } from '.' export default class NotFound extends React.PureComponent { render() { - const { data, emojiProps, i18n, notFound } = this.props + const { data, emojiProps, i18n, notFound, notFoundEmoji } = this.props const component = (notFound && notFound()) || (
@@ -12,7 +12,7 @@ export default class NotFound extends React.PureComponent { data: data, ...emojiProps, size: 38, - emoji: 'sleuth_or_spy', + emoji: notFoundEmoji, onOver: null, onLeave: null, onClick: null, @@ -27,9 +27,6 @@ export default class NotFound extends React.PureComponent { NotFound.propTypes = { notFound: PropTypes.func.isRequired, + notFoundString: PropTypes.string.isRequired, emojiProps: PropTypes.object.isRequired, } - -NotFound.defaultProps = { - notFound: () => {}, -} diff --git a/src/components/picker/nimble-picker.js b/src/components/picker/nimble-picker.js index 1bd3fc5..45d6568 100644 --- a/src/components/picker/nimble-picker.js +++ b/src/components/picker/nimble-picker.js @@ -468,6 +468,7 @@ export default class NimblePicker extends React.PureComponent { recent, autoFocus, notFound, + notFoundEmoji, } = this.props, { skin } = this.state, width = perLine * (emojiSize + 12) + 12 + 2 + measureScrollbar() @@ -541,6 +542,7 @@ export default class NimblePicker extends React.PureComponent { onClick: this.handleEmojiClick, }} notFound={notFound} + notFoundEmoji={notFoundEmoji} /> ) })} diff --git a/src/utils/shared-props.js b/src/utils/shared-props.js index 9509825..c2041be 100644 --- a/src/utils/shared-props.js +++ b/src/utils/shared-props.js @@ -72,6 +72,7 @@ const PickerPropTypes = { }), ), notFound: PropTypes.func, + notFoundEmoji: PropTypes.string, } const PickerDefaultProps = { @@ -98,6 +99,7 @@ const PickerDefaultProps = { autoFocus: false, custom: [], notFound: () => {}, + notFoundEmoji: 'sleuth_or_spy', } export { diff --git a/stories/index.js b/stories/index.js index 2250cf9..d51a10a 100644 --- a/stories/index.js +++ b/stories/index.js @@ -36,6 +36,7 @@ storiesOf('Picker', module) perLine={number('Per line', 9)} title={text('Idle text', 'Your Title Here')} emoji={text('Idle emoji', 'department_store')} + notFoundEmoji={text('Not found emoji', 'sleuth_or_spy')} defaultSkin={number('Default skin tone', 1)} color={color('Highlight color', '#ae65c5')} showPreview={boolean('Show preview', true)}