diff --git a/README.md b/README.md
index 1afbed6..f579973 100644
--- a/README.md
+++ b/README.md
@@ -56,7 +56,8 @@ This component requires 3 dependencies :
| keepSearchOnSelect | bool | false | Prevents the autocomplete field's value to be reset after each selection.|
| disabled | bool | false | Include this property to disable superSelectField.|
| value | null, object, object[] | null | Selected value(s).
/!\ REQUIRED: each object must expose a 'value' property. |
-| onChange | function | () => {} | Triggers when selecting/unselecting an option from the Menu.
signature: (selectedValues, name) with `selectedValues` array of selected values based on selected nodes' value property, and `name` the value of the superSelectField instance's name property |
+| onChange | function | () => {} | Triggers when closing the menu. Use this if you do not want to update your component state with each selection and only on menu close.
signature: (selectedValues, name) with `selectedValues` array of selected values based on selected nodes' value property, and `name` the value of the superSelectField instance's name property |
+| onSelect | function | () => {} | Triggers when selecting an item in the menu. Use this to update your componenet state with each selection from the menu (while still open).
signature: (selectedValues, name) with `selectedValues` array of selected values based on selected nodes' value property, and `name` the value of the superSelectField instance's name property |
| onMenuOpen | function | () => {} | Triggers when opening the Menu. |
| onAutoCompleteTyping | function | () => {} | Exposes the word typed in AutoComplete. Useful for triggering onType API requests. |
| children | any | [] | Datasource is an array of any type of nodes, styled at your convenience.
/!\ REQUIRED: each node must expose a `value` property. This value property will be used by default for both option's value and label.
A `label` property can be provided to specify a different value than `value`. |
diff --git a/src/SuperSelectField.js b/src/SuperSelectField.js
index 6c2fe7c..1453f6d 100644
--- a/src/SuperSelectField.js
+++ b/src/SuperSelectField.js
@@ -78,6 +78,11 @@ class SelectField extends Component {
})
}
+ getSelected = () => {
+ const {onSelect, name} = this.props;
+ onSelect(this.state.selectedItems, name);
+ }
+
openMenu() {
if (!this.state.isOpen) this.props.onMenuOpen()
if (this.state.itemsLength || this.props.showAutocompleteThreshold === 'always') this.setState({ isOpen: true }, () => this.focusTextField())
@@ -146,7 +151,7 @@ class SelectField extends Component {
const updatedValues = selectedItemExists
? selectedItems.filter(obj => !areEqual(obj.value, selectedItem.value))
: selectedItems.concat(selectedItem)
- this.setState({ selectedItems: updatedValues })
+ this.setState({ selectedItems: updatedValues }, this.getSelected())
this.clearTextField(() => this.focusTextField())
}
else {
diff --git a/src/defaultProps.js b/src/defaultProps.js
index 717d559..0246dbe 100644
--- a/src/defaultProps.js
+++ b/src/defaultProps.js
@@ -48,6 +48,7 @@ export const selectFieldDefaultProps = {
},
value: null,
onChange: () => {},
+ onSelect: () => {},
onMenuOpen: () => {},
onAutoCompleteTyping: () => {},
children: []
diff --git a/src/types/index.js b/src/types/index.js
index 2b515df..8102c2e 100644
--- a/src/types/index.js
+++ b/src/types/index.js
@@ -144,6 +144,7 @@ export const selectFieldTypes = {
keepSearchOnSelect: bool,
disabled: bool,
onChange: func,
+ onSelect: func,
onMenuOpen: func,
onAutoCompleteTyping: func
}