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 }