Adds onFocus prop to EuiComboBox (#1375)

* Added onFocus prop to EuiComboBox * Update src/components/combo_box/index.d.ts Co-Authored-By: zumwalt <[email protected]> * Import FocusEventHandler
elastic · Dec 17, 2018 · 28e0a1a · 28e0a1a
1 parent 2f80577
commit 28e0a1a
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 3 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,6 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
+- Added `onFocus` prop to `EuiComboBox` ([#1375](https://github.com/elastic/eui/pull/1375))
 - Added `DisambiguateSet` and `ExclusiveUnion` utility types ([#1368](https://github.com/elastic/eui/pull/1368))
 
 **Bug fixes**

diff --git a/src/components/combo_box/combo_box.js b/src/components/combo_box/combo_box.js
@@ -39,6 +39,7 @@ export class EuiComboBox extends Component {
     options: PropTypes.array,
     selectedOptions: PropTypes.array,
     onChange: PropTypes.func,
+    onFocus: PropTypes.func,
     onSearchChange: PropTypes.func,
     onCreateOption: PropTypes.func,
     renderOption: PropTypes.func,
@@ -262,7 +263,10 @@ export class EuiComboBox extends Component {
     return flattenOptionGroups(options).length === selectedOptions.length;
   };
 
-  onFocus = () => {
+  onComboBoxFocus = () => {
+    if (this.props.onFocus) {
+      this.props.onFocus();
+    }
     this.openList();
   }
 
@@ -597,7 +601,7 @@ export class EuiComboBox extends Component {
           onRemoveOption={this.onRemoveOption}
           onClick={this.onComboBoxClick}
           onChange={this.onSearchChange}
-          onFocus={this.onFocus}
+          onFocus={this.onComboBoxFocus}
           value={value}
           searchValue={searchValue}
           autoSizeInputRef={this.autoSizeInputRef}

diff --git a/src/components/combo_box/index.d.ts b/src/components/combo_box/index.d.ts
@@ -1,4 +1,4 @@
-import { ButtonHTMLAttributes, ReactNode, SFC } from 'react';
+import { ButtonHTMLAttributes, ReactNode, SFC, FocusEventHandler } from 'react';
 import { ListProps } from 'react-virtualized';
 import {
   EuiComboBoxOption,
@@ -64,6 +64,7 @@ declare module '@elastic/eui' {
     options?: EuiComboBoxOptionsListProps['options'],
     selectedOptions?: EuiComboBoxOptionsListProps['selectedOptions'],
     onChange?: (options: Array<EuiComboBoxOptionProps>) => any,
+    onFocus?: FocusEventHandler<HTMLInputElement>,
     onSearchChange?: (searchValue: string) => any,
     onCreateOption?: EuiComboBoxOptionsListProps['onCreateOption'],
     renderOption?: EuiComboBoxOptionsListProps['renderOption'],