asb_cloud_front/src/components/LoaderPortal.tsx

20 lines
664 B
TypeScript
Executable File

import { HTMLAttributes } from 'react'
import { Loader } from '@components/icons'
type LoaderPortalProps = HTMLAttributes<HTMLDivElement> & {
show?: boolean,
fade?: boolean,
spinnerProps?: HTMLAttributes<HTMLDivElement>,
}
export const LoaderPortal: React.FC<LoaderPortalProps> = ({ className = '', show, fade = true, children, spinnerProps, ...other }) => (
<div className={`loader-container ${className}`} {...other}>
<div className={'loader-content'}>{children}</div>
{show && fade && <div className={'loader-fade'}/>}
{show && <div className={'loader-overlay'}><Loader {...spinnerProps} /></div>}
</div>
)
export default LoaderPortal