import React from 'react';

import Portal from '../Portal';

import { Container, Blanket, Content } from './styled';

type Props = {
  children: React.ReactNode;
  hideBackdrop?: boolean;
};

const Modal: React.FC<Props> = ({ children, hideBackdrop = false }: Props) => (
  <Portal>
    <Container>
      {hideBackdrop ? null : <Blanket />}
      <Content>{children}</Content>
    </Container>
  </Portal>
);

export default Modal;