diff --git a/CHANGELOG.md b/CHANGELOG.md index 19a20ee52cc..5025cc0cbcc 100644 --- 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 index 3989c9c557c..63f83506661 100644 --- 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 index c10f514ad33..53e3aab20da 100644 --- 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) => any, + onFocus?: FocusEventHandler, onSearchChange?: (searchValue: string) => any, onCreateOption?: EuiComboBoxOptionsListProps['onCreateOption'], renderOption?: EuiComboBoxOptionsListProps['renderOption'],