mon-entreprise/source/components/Overlay.js

35 lines
808 B
JavaScript
Raw Normal View History

import FocusTrap from 'focus-trap-react'
import React from 'react'
import * as animate from 'Ui/animate'
2018-07-12 08:09:41 +00:00
import { LinkButton } from 'Ui/Button'
import './Overlay.css'
export default function Overlay({ onClose, children, ...otherProps }) {
return (
<div id="overlayWrapper">
<animate.fromBottom>
<FocusTrap
focusTrapOptions={{
onDeactivate: onClose,
clickOutsideDeactivates: !!onClose
}}>
<div
aria-modal="true"
id="overlayContent"
{...otherProps}
className={'ui__ card ' + otherProps.className}>
{children}
{onClose && (
<LinkButton
aria-label="close"
onClick={onClose}
id="overlayCloseButton">
×
</LinkButton>
)}
</div>
</FocusTrap>
</animate.fromBottom>
</div>
)
}