github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 01:38:56 -04:00
Code Issues Projects Releases Packages Wiki Activity

[Data UI] [Fleet] Add submitOnBlur functionality to QueryStringInput (#93819)

Browse source 
Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Zacqary Adam Xeper 2021-03-15 13:33:49 -05:00 • committed by GitHub
parent 85c0a34893
commit cda2fb3d5a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 14 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

1
docs/development/plugins/data/public/kibana-plugin-plugins-data-public.querystringinputprops.md
View file

@ -36,4 +36,5 @@ export interface QueryStringInputProps
| [query](./kibana-plugin-plugins-data-public.querystringinputprops.query.md) | <code>Query</code> | |
| [screenTitle](./kibana-plugin-plugins-data-public.querystringinputprops.screentitle.md) | <code>string</code> | |
| [size](./kibana-plugin-plugins-data-public.querystringinputprops.size.md) | <code>SuggestionsListSize</code> | |
| [submitOnBlur](./kibana-plugin-plugins-data-public.querystringinputprops.submitonblur.md) | <code>boolean</code> | |

2
src/plugins/data/public/public.api.md
View file

@ -2054,6 +2054,8 @@ export interface QueryStringInputProps {
//
// (undocumented)
size?: SuggestionsListSize;
// (undocumented)
submitOnBlur?: boolean;
}
// @public (undocumented)

10
src/plugins/data/public/ui/query_string_input/query_string_input.tsx
View file

@ -53,6 +53,7 @@ export interface QueryStringInputProps {
onChange?: (query: Query) => void;
onChangeQueryInputFocus?: (isFocused: boolean) => void;
onSubmit?: (query: Query) => void;
submitOnBlur?: boolean;
dataTestSubj?: string;
size?: SuggestionsListSize;
className?: string;
@ -506,6 +507,15 @@ export default class QueryStringInputUI extends Component<Props, State> {
if (isFunction(this.props.onBlur)) {
this.props.onBlur();
}
if (this.props.submitOnBlur) {
// Input blur triggers when the user selects something from autocomplete, so wait a bit to ensure that
// the entire QueryStringInput component has actually blurred (e.g. from user clicking or tabbing away)
setTimeout(() => {
if (document.activeElement !== this.inputRef) {
this.onSubmit(this.props.query);
}
}, 200);
}
};
private onClickSuggestion = (suggestion: QuerySuggestion, index: number) => {

1
x-pack/plugins/fleet/public/applications/fleet/components/search_bar.tsx
View file

@ -96,6 +96,7 @@ export const SearchBar: React.FunctionComponent<Props> = ({
onSubmit={(newQuery) => {
onChange(newQuery.query as string, true);
}}
submitOnBlur
/>
);
};