import React, { FC, PropsWithChildren } from "react";
import { motion } from "framer-motion";
import { Box, Tabs } from "@mantine/core";

type Props = {
    value: string;
};

const DealEditorTabPanel: FC<PropsWithChildren<Props>> = ({
    value,
    children,
}) => {
    return (
        <Tabs.Panel
            key={value}
            value={value}>
            <motion.div
                initial={{ opacity: 0 }}
                animate={{ opacity: 1 }}
                transition={{ duration: 0.2 }}>
                <Box
                    h={"100%"}
                    w={"100%"}>
                    {children}
                </Box>
            </motion.div>
        </Tabs.Panel>
    );
};

export default DealEditorTabPanel;