import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Button } from '../../Button';
import { Typography } from '../../Typography';
import { useViewportType } from '../../useViewportType';
import { Container, Footer, Image, Wrapper, WrapperTextContent, } from './styles';
export const BannerTemplate = (props) => {
    const { closeToast, imageSrc, title, description, onClose, action, setIsOpenDialog, } = props;
    const { isMobile } = useViewportType();
    const handleClose = () => {
        closeToast?.();
        onClose?.();
    };
    const handleCloseForAction = () => {
        closeToast?.();
        setIsOpenDialog?.(false);
    };
    return (_jsxs(Container, { children: [imageSrc && _jsx(Image, { src: imageSrc }), _jsxs(Wrapper, { container: true, children: [_jsxs(WrapperTextContent, { container: true, children: [title && _jsx(Typography, { variant: "h4", children: title }), description && (_jsx(Typography, { variant: "body1", children: description }))] }), _jsxs(Footer, { children: [!isMobile && (_jsx(Button, { onClick: handleClose, variant: "text", size: "large", children: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C" })), action?.({ closeBanner: handleCloseForAction })] })] })] }));
};
