Skip to content

Commit

Permalink
[Lens] setFocusTrap after animation is ended and not with timeout (#1…
Browse files Browse the repository at this point in the history
…01148) (#101258)

Co-authored-by: Marta Bondyra <[email protected]>
  • Loading branch information
kibanamachine and mbondyra authored Jun 3, 2021
1 parent 650ce6f commit 08ba260
Showing 1 changed file with 7 additions and 9 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -44,15 +44,6 @@ export function DimensionContainer({
setFocusTrapIsEnabled(false);
}, [handleClose]);

useEffect(() => {
if (isOpen) {
// without setTimeout here the flyout pushes content when animating
setTimeout(() => {
setFocusTrapIsEnabled(true);
}, 255);
}
}, [isOpen]);

const closeOnEscape = useCallback(
(event: KeyboardEvent) => {
if (event.key === keys.ESCAPE) {
Expand Down Expand Up @@ -83,6 +74,13 @@ export function DimensionContainer({
role="dialog"
aria-labelledby="lnsDimensionContainerTitle"
className="lnsDimensionContainer euiFlyout"
onAnimationEnd={() => {
if (isOpen) {
// EuiFocusTrap interferes with animating elements with absolute position:
// running this onAnimationEnd, otherwise the flyout pushes content when animating
setFocusTrapIsEnabled(true);
}
}}
>
<EuiFlyoutHeader hasBorder className="lnsDimensionContainer__header">
<EuiFlexGroup
Expand Down

0 comments on commit 08ba260

Please sign in to comment.