maxmustermann/kibana
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

fix: add EuiOutsideClickDetector (#78733)

Browse source 
Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
Marta Bondyra 2020-10-01 12:54:48 +02:00 committed by GitHub
parent d11da3275d
commit 8948811c63
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 33 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

63
x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/dimension_container.tsx
View file

@ -13,6 +13,7 @@ import {
EuiButtonEmpty,
EuiFlexItem,
EuiFocusTrap,
EuiOutsideClickDetector,
} from '@elastic/eui';
import classNames from 'classnames';
@ -91,37 +92,39 @@ export function DimensionContainer({
const flyout = flyoutIsVisible && (
<EuiFocusTrap disabled={!focusTrapIsEnabled} clickOutsideDisables={true}>
<div
role="dialog"
aria-labelledby="lnsDimensionContainerTitle"
className={classNames('lnsDimensionContainer', {
'lnsDimensionContainer--noAnimation': openByCreation,
})}
>
<EuiFlyoutHeader hasBorder className="lnsDimensionContainer__header">
<EuiTitle size="xs">
<EuiButtonEmpty
onClick={closeFlyout}
data-test-subj="lns-indexPattern-dimensionContainerTitle"
id="lnsDimensionContainerTitle"
iconType="sortLeft"
flush="left"
>
<strong>{panelTitle}</strong>
<EuiOutsideClickDetector onOutsideClick={closeFlyout} isDisabled={!flyoutIsVisible}>
<div
role="dialog"
aria-labelledby="lnsDimensionContainerTitle"
className={classNames('lnsDimensionContainer', {
'lnsDimensionContainer--noAnimation': openByCreation,
})}
>
<EuiFlyoutHeader hasBorder className="lnsDimensionContainer__header">
<EuiTitle size="xs">
<EuiButtonEmpty
onClick={closeFlyout}
data-test-subj="lns-indexPattern-dimensionContainerTitle"
id="lnsDimensionContainerTitle"
iconType="sortLeft"
flush="left"
>
<strong>{panelTitle}</strong>
</EuiButtonEmpty>
</EuiTitle>
</EuiFlyoutHeader>
<EuiFlexItem className="eui-yScrollWithShadows" grow={1}>
{panel}
</EuiFlexItem>
<EuiFlyoutFooter className="lnsDimensionContainer__footer">
<EuiButtonEmpty flush="left" size="s" iconType="cross" onClick={closeFlyout}>
{i18n.translate('xpack.lens.dimensionContainer.close', {
defaultMessage: 'Close',
})}
</EuiButtonEmpty>
</EuiTitle>
</EuiFlyoutHeader>
<EuiFlexItem className="eui-yScrollWithShadows" grow={1}>
{panel}
</EuiFlexItem>
<EuiFlyoutFooter className="lnsDimensionContainer__footer">
<EuiButtonEmpty flush="left" size="s" iconType="cross" onClick={closeFlyout}>
{i18n.translate('xpack.lens.dimensionContainer.close', {
defaultMessage: 'Close',
})}
</EuiButtonEmpty>
</EuiFlyoutFooter>
</div>
</EuiFlyoutFooter>
</div>
</EuiOutsideClickDetector>
</EuiFocusTrap>
);