fix(pf4): enabled downshift multi select searchable

Author: Hyperkid123

packages/pf4-component-mapper/demo/demo-schemas/select-schema.js

@@ -32,6 +32,14 @@ const selectSchema = {
       options,
       isMulti: true
     },
+    {
+      component: componentTypes.SELECT,
+      name: 'multi-searchable-select',
+      label: 'Searchable multi select',
+      options,
+      isMulti: true,
+      isSearchable: true
+    },
     {
       component: componentTypes.SELECT,
       name: 'simple-select',

packages/pf4-component-mapper/src/common/select/input.js

@@ -4,19 +4,23 @@ import { Divider } from '@patternfly/react-core';
 
 import './input.scss';
 
-const Input = ({ inputRef, isSearchable, isDisabled, getInputProps, ...props }) => {
+const Input = ({ inputRef, isSearchable, isDisabled, getInputProps, value, ...props }) => {
+  const inputProps = getInputProps({ disabled: isDisabled });
   return (
     <Fragment>
       <div className="pf-c-select__menu-search">
         <input
           autoFocus
+          value=""
           {...props}
           {...(!isSearchable && { tabIndex: '-1' })}
           className="pf-c-form-control pf-m-search"
           ref={inputRef}
-          {...getInputProps({
-            disabled: isDisabled
-          })}
+          {...{
+            ...inputProps,
+            value: inputProps.value || '',
+            onChange: inputProps.onChange || Function
+          }}
         />
       </div>
       <Divider />

packages/pf4-component-mapper/src/common/select/select.js

@@ -84,7 +84,13 @@ const stateReducer = (state, changes, keepMenuOpen) => {
       return {
         ...changes,
         isOpen: keepMenuOpen ? state.isOpen : !state.isOpen,
-        highlightedIndex: state.highlightedIndex
+        highlightedIndex: state.highlightedIndex,
+        inputValue: state.inputValue // prevent filter value change after option click
+      };
+    case Downshift.stateChangeTypes.controlledPropUpdatedSelectedItem:
+      return {
+        ...changes,
+        inputValue: typeof changes.inputValue === 'string' ? changes.inputValue : state.inputValue
       };
     default:
       return changes;