import * as React from 'react';
import Box from '@mui/material/Box';
import Drawer from '@mui/material/Drawer';
import Button from '@mui/material/Button';
import {SxProps, Theme} from "@mui/material";

interface Props {
    outerContainerSx?: SxProps<Theme>;
    children?: React.ReactNode;
    isOpenDrawer: string;
    drawerNewFieldHC: (str: string) => void
}

export default function DrawerNewField({outerContainerSx: sx, children, isOpenDrawer: isOpen, drawerNewFieldHC }: Props) {

    return (
        <>
            <Drawer
                anchor='right'
                open={Boolean(isOpen)}
                onClose={() => drawerNewFieldHC("")}
            >
                <Box
                    sx={{ width: 450 }}
                    role="presentation"
                >

                    {children}
                </Box>
            </Drawer>
        </>
    );
}