adds functionality to disable the frequent emoji sorting, updates storybook for visibility

release
SaraRandolph 2020-03-04 15:47:53 -07:00 committed by Etienne Lemay
parent 769b55c875
commit cdb6c26a08
4 changed files with 28 additions and 1 deletions

View File

@ -289,7 +289,9 @@ export default class NimblePicker extends React.PureComponent {
var component = this.categoryRefs['category-1']
if (component) {
let maxMargin = component.maxMargin
component.forceUpdate()
if (!this.props.disableFrequentEmojiSort){
component.forceUpdate()
}
requestAnimationFrame(() => {
if (!this.scroll) return
@ -523,6 +525,7 @@ export default class NimblePicker extends React.PureComponent {
exclude,
recent,
autoFocus,
disableFrequentEmojiSort,
skinEmoji,
notFound,
notFoundEmoji,

View File

@ -37,6 +37,7 @@ const PickerDefaultProps = {
),
emojiTooltip: EmojiDefaultProps.tooltip,
autoFocus: false,
disableFrequentEmojiSort: false,
custom: [],
skinEmoji: '',
notFound: () => {},

View File

@ -43,6 +43,7 @@ const PickerPropTypes = {
exclude: PropTypes.arrayOf(PropTypes.string),
recent: PropTypes.arrayOf(PropTypes.string),
autoFocus: PropTypes.bool,
disableFrequentEmojiSort: PropTypes.bool,
custom: PropTypes.arrayOf(
PropTypes.shape({
name: PropTypes.string.isRequired,

View File

@ -74,6 +74,28 @@ storiesOf('Picker', module)
/>
))
.add('Pause Frequent Emoji Sort', () => (
<Picker
disableFrequentEmojiSort={boolean('Unicode', true)}
onClick={action('clicked')}
onSelect={action('selected')}
onSkinChange={action('skin changed')}
native={boolean('Unicode', true)}
darkMode={boolean('Dark mode', false)}
set={select('Emoji pack', SETS, SETS[0])}
emojiSize={number('Emoji size', 24)}
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)}
showSkinTones={boolean('Show skin tones', true)}
custom={CUSTOM_EMOJIS}
/>
))
.add('Custom category icons', () => (
<Picker
custom={CUSTOM_EMOJIS}