add prop to autofocus search input

release
Vincent Taverna 2017-04-04 11:07:48 -04:00
parent b4f39a2730
commit a4419720e8
2 changed files with 11 additions and 5 deletions

View File

@ -265,7 +265,7 @@ export default class Picker extends React.Component {
} }
render() { render() {
var { perLine, emojiSize, set, sheetSize, style, title, emoji, color, native, backgroundImageFn, emojisToShowFilter } = this.props, var { perLine, emojiSize, set, sheetSize, style, title, emoji, color, native, backgroundImageFn, emojisToShowFilter, autoFocus } = this.props,
{ skin } = this.state, { skin } = this.state,
width = (perLine * (emojiSize + 12)) + 12 + 2 width = (perLine * (emojiSize + 12)) + 12 + 2
@ -286,6 +286,7 @@ export default class Picker extends React.Component {
onSearch={this.handleSearch.bind(this)} onSearch={this.handleSearch.bind(this)}
i18n={this.i18n} i18n={this.i18n}
emojisToShowFilter={emojisToShowFilter} emojisToShowFilter={emojisToShowFilter}
autoFocus={autoFocus}
/> />
{this.getCategories().map((category, i) => { {this.getCategories().map((category, i) => {
@ -353,7 +354,8 @@ Picker.propTypes = {
sheetSize: Emoji.propTypes.sheetSize, sheetSize: Emoji.propTypes.sheetSize,
emojisToShowFilter: React.PropTypes.func, emojisToShowFilter: React.PropTypes.func,
include: React.PropTypes.arrayOf(React.PropTypes.string), include: React.PropTypes.arrayOf(React.PropTypes.string),
exclude: React.PropTypes.arrayOf(React.PropTypes.string) exclude: React.PropTypes.arrayOf(React.PropTypes.string),
autoFocus: React.PropTypes.bool,
} }
Picker.defaultProps = { Picker.defaultProps = {
@ -371,4 +373,5 @@ Picker.defaultProps = {
sheetSize: Emoji.defaultProps.sheetSize, sheetSize: Emoji.defaultProps.sheetSize,
backgroundImageFn: Emoji.defaultProps.backgroundImageFn, backgroundImageFn: Emoji.defaultProps.backgroundImageFn,
emojisToShowFilter: (codePoint) => true, emojisToShowFilter: (codePoint) => true,
autoFocus: false,
} }

View File

@ -14,7 +14,7 @@ export default class Search extends React.Component {
} }
render() { render() {
var { i18n } = this.props var { i18n, autoFocus } = this.props
return <input return <input
ref='input' ref='input'
@ -22,6 +22,7 @@ export default class Search extends React.Component {
onChange={this.handleChange.bind(this)} onChange={this.handleChange.bind(this)}
placeholder={i18n.search} placeholder={i18n.search}
className='emoji-mart-search' className='emoji-mart-search'
autoFocus={autoFocus}
/> />
} }
} }
@ -29,11 +30,13 @@ export default class Search extends React.Component {
Search.propTypes = { Search.propTypes = {
onSearch: React.PropTypes.func, onSearch: React.PropTypes.func,
maxResults: React.PropTypes.number, maxResults: React.PropTypes.number,
emojisToShowFilter: React.PropTypes.func emojisToShowFilter: React.PropTypes.func,
autoFocus: React.PropTypes.bool,
} }
Search.defaultProps = { Search.defaultProps = {
onSearch: (() => {}), onSearch: (() => {}),
maxResults: 75, maxResults: 75,
emojisToShowFilter: () => true emojisToShowFilter: () => true,
autoFocus: false,
} }