From 32cf6dd38fe165d7e26913e4ad446e96227f0cb3 Mon Sep 17 00:00:00 2001 From: davidroeca Date: Wed, 30 Aug 2017 17:59:29 -0400 Subject: [PATCH 1/4] add onSelectResetsInput prop --- src/Select.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/Select.js b/src/Select.js index 5baf0d9067..843f3da0a1 100644 --- a/src/Select.js +++ b/src/Select.js @@ -516,10 +516,11 @@ class Select extends React.Component { //NOTE: update value in the callback to make sure the input value is empty so that there are no styling issues (Chrome had issue otherwise) this.hasScrolledToOption = false; if (this.props.multi) { - this.setState({ + const updatedState = !this.props.onSelectResetsInput ? {} : { inputValue: this.handleInputValueChange(''), focusedIndex: null - }, () => { + }; + this.setState(updatedState, () => { this.addValue(value); }); } else { @@ -1090,6 +1091,7 @@ Select.propTypes = { onInputKeyDown: PropTypes.func, // input keyDown handler: function (event) {} onMenuScrollToBottom: PropTypes.func, // fires when the menu is scrolled to the bottom; can be used to paginate options onOpen: PropTypes.func, // fires when the menu is opened + onSelectResetsInput: PropTypes.bool, // whether input is cleared on select (works only for multiselect) onValueClick: PropTypes.func, // onClick handler for value labels: function (value, event) {} openAfterFocus: PropTypes.bool, // boolean to enable opening dropdown when focused openOnFocus: PropTypes.bool, // always open options menu on focus @@ -1142,6 +1144,7 @@ Select.defaultProps = { multi: false, noResultsText: 'No results found', onBlurResetsInput: true, + onSelectResetsInput: true, onCloseResetsInput: true, optionComponent: Option, pageSize: 5, From 8ead69eaf58e4efcfc0a8079db73228fd842661d Mon Sep 17 00:00:00 2001 From: davidroeca Date: Wed, 30 Aug 2017 19:33:05 -0400 Subject: [PATCH 2/4] update the setState logic --- src/Select.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/Select.js b/src/Select.js index 843f3da0a1..9f6898d5c4 100644 --- a/src/Select.js +++ b/src/Select.js @@ -516,11 +516,11 @@ class Select extends React.Component { //NOTE: update value in the callback to make sure the input value is empty so that there are no styling issues (Chrome had issue otherwise) this.hasScrolledToOption = false; if (this.props.multi) { - const updatedState = !this.props.onSelectResetsInput ? {} : { - inputValue: this.handleInputValueChange(''), + const updatedValue = this.props.onSelectResetsInput ? '' : this.state.inputValue; + this.setState({ + inputValue: this.handleInputValueChange(updatedValue), focusedIndex: null - }; - this.setState(updatedState, () => { + } , () => { this.addValue(value); }); } else { From eabec905896d5c5b5bec6eb57b6076026b04759a Mon Sep 17 00:00:00 2001 From: davidroeca Date: Thu, 31 Aug 2017 12:33:51 -0400 Subject: [PATCH 3/4] update spaces->tabs --- src/Select.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/Select.js b/src/Select.js index 9f6898d5c4..acc483595b 100644 --- a/src/Select.js +++ b/src/Select.js @@ -516,11 +516,11 @@ class Select extends React.Component { //NOTE: update value in the callback to make sure the input value is empty so that there are no styling issues (Chrome had issue otherwise) this.hasScrolledToOption = false; if (this.props.multi) { - const updatedValue = this.props.onSelectResetsInput ? '' : this.state.inputValue; - this.setState({ + const updatedValue = this.props.onSelectResetsInput ? '' : this.state.inputValue; + this.setState({ inputValue: this.handleInputValueChange(updatedValue), focusedIndex: null - } , () => { + } , () => { this.addValue(value); }); } else { From a20543f45d708866114133992d59644159180431 Mon Sep 17 00:00:00 2001 From: davidroeca Date: Thu, 31 Aug 2017 12:35:03 -0400 Subject: [PATCH 4/4] more style fixes --- src/Select.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Select.js b/src/Select.js index acc483595b..e35cb3a61f 100644 --- a/src/Select.js +++ b/src/Select.js @@ -520,7 +520,7 @@ class Select extends React.Component { this.setState({ inputValue: this.handleInputValueChange(updatedValue), focusedIndex: null - } , () => { + }, () => { this.addValue(value); }); } else {