160f8da6aa
* MP-3105: finished rewards center * tidy: refactor * fix: rerolled generated types * fix: revert types to before * refactor: addressed feedback
38 lines
1.0 KiB
TypeScript
38 lines
1.0 KiB
TypeScript
import classNames from 'classnames'
|
|
import { ReactNode } from 'react'
|
|
|
|
interface Props {
|
|
children?: ReactNode | string
|
|
content?: ReactNode | string
|
|
className?: string
|
|
hasBackdropIsolation?: boolean
|
|
show: boolean
|
|
setShow: (show: boolean) => void
|
|
}
|
|
|
|
export default function Overlay(props: Props) {
|
|
const onClickAway = () => {
|
|
props.setShow(false)
|
|
}
|
|
|
|
return props.show ? (
|
|
<>
|
|
<div
|
|
className={classNames(
|
|
'max-w-screen absolute isolate z-50 rounded-base shadow-overlay backdrop-blur-lg',
|
|
props.hasBackdropIsolation ? 'bg-body' : 'gradient-popover',
|
|
'before:content-[" "] before:absolute before:inset-0 before:-z-1 before:rounded-base before:p-[1px] before:border-glas',
|
|
props.className,
|
|
)}
|
|
>
|
|
{props.children ? props.children : props.content}
|
|
</div>
|
|
<div
|
|
className='fixed top-0 left-0 z-40 block w-full h-full hover:cursor-pointer'
|
|
onClick={onClickAway}
|
|
role='button'
|
|
/>
|
|
</>
|
|
) : null
|
|
}
|