import React from 'react' ; import { EuiFlyout , EuiFlyoutBody , EuiFlyoutHeader , EuiTitle } from '@elastic/eui' ; import { QUERY_TESTER_TITLE } from './i18n' ; import { QueryTester } from './query_tester' ; interface Props { onClose : ( ) => void ; } export const QueryTesterFlyout = ( { onClose } ) => { return ( < EuiFlyout onClose = { onClose } aria - labelledby = "queryTesterFlyoutTitle" ownFocus > < EuiFlyoutHeader hasBorder > < EuiTitle size = "m" > < h2 id = "queryTesterFlyoutTitle" > { QUERY_TESTER_TITLE } < /h2> < /EuiTitle> < /EuiFlyoutHeader> < EuiFlyoutBody > < QueryTester /> < /EuiFlyoutBody> < /EuiFlyout>); } ;