✨ Add onInput prop to personFinder

Author: Jonas Gossens

examples/react-chayns-personfinder/Example.jsx

@@ -124,6 +124,7 @@ export default class PersonFinderExample extends PureComponent {
                     parent={document.getElementById('portal-example')}
                     boxClassName="custom-personfinder-overlay"
                 />
+                <PersonFinder onInput={console.log} />
                 <Button
                     onClick={this.clear}
                 >

src/react-chayns-personfinder/README.md

@@ -42,6 +42,7 @@ Then it can be used like in the following example:
 | uacId         | ID of the UAC-Group to search in                                                                   | number         |               |
 | locationId    | LocationId of the UAC-Group to search in                                                           | number         |               |
 | reducerFunction | Function to reduce the results (see example)                                                     | Function       |               |
+| onInput       | Callback on input                                                                                  | Function       |               |
 
 ## Clear the PersonFinder
 If you want to clear the PersonFinder, you need to have a reference to the ReactElement:

src/react-chayns-personfinder/component/SimplePersonFinder.jsx

@@ -26,6 +26,7 @@ export default class SimplePersonFinder extends Component {
             }),
             PropTypes.string,
         ]),
+        onInput: PropTypes.func,
     };
 
     static defaultProps = {
@@ -35,6 +36,7 @@ export default class SimplePersonFinder extends Component {
         defaultValue: null,
         className: null,
         showId: false,
+        onInput: null,
     };
 
     static PERSON = PERSON_RELATION;
@@ -55,10 +57,14 @@ export default class SimplePersonFinder extends Component {
     }
 
     handleOnChange(inputValue) {
+        const { onInput } = this.props;
         this.setState({
             inputValue,
             selectedValue: false,
         });
+        if (onInput && typeof onInput === 'function') {
+            onInput(inputValue);
+        }
     }
 
     handleSelect(type, value) {