import { type FC, type PropsWithChildren } from 'react';

import Container from '@material-hu/mui/Container';
import { type SxProps } from '@material-hu/mui/styles';

type Props = {
  sx?: SxProps;
  maxWidth?: 'lg' | 'md' | 'sm' | 'xs' | 'xl';
};

const ContainerLayout: FC<PropsWithChildren<Props>> = ({
  children,
  maxWidth = 'lg',
  sx = {},
}) => {
  return (
    <Container
      maxWidth={maxWidth}
      sx={{ marginInline: 'auto', pt: 6, ...sx }}
    >
      {children}
    </Container>
  );
};

export default ContainerLayout;