import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { CrossOutlineMd } from '../../icons/CrossOutlineMd';
import { IconButton } from '../IconButton';
import { Typography } from '../Typography';
import { HeaderContent, Wrapper } from './styles';
export const DialogHeader = ({ children, title, justifyContent = 'flex-start', disableSpacing, onClose, className, }) => {
    const handleTitleClick = (e) => {
        if (onClose) {
            onClose(e, 'escapeKeyDown');
        }
    };
    return (_jsxs(Wrapper, { className: className, hasTitle: Boolean(title), hasOnClose: Boolean(onClose), children: [title && _jsx(Typography, { variant: "h4", children: title }), _jsx(HeaderContent, { justifyContent: justifyContent, columnSpacing: disableSpacing ? 0 : 2, children: children }), onClose && (_jsx(IconButton, { variant: "text", onClick: handleTitleClick, "aria-label": "\u0417\u0430\u043A\u0440\u044B\u0442\u044C \u043C\u043E\u0434\u0430\u043B\u044C\u043D\u043E\u0435 \u043E\u043A\u043D\u043E", children: _jsx(CrossOutlineMd, {}) }))] }));
};
