import React from 'react';
import { X } from '@wix/wix-ui-icons-common';
import IconButton from '../IconButton';
import { st, classes } from './ModalMobileLayout.st.css.js';
import Title from './components/Title/Title';
import Footer from './components/Footer/Footer';
import { useIcons } from '../WixDesignSystemIconThemeProvider';
const ModalMobileLayout = ({ dataHook, className, title, content, footer, onOverlayClick, onCloseButtonClick, fullscreen = false, stickyTitle = false, stickyFooter = false, }) => {
    const icons = useIcons('ModalMobileLayout', {
        X,
    });
    return (React.createElement("div", { id: "modalMobileLayout-root", "data-hook": dataHook, className: st(classes.root, {
            fullscreen,
            noTitle: !title,
            noFooter: !footer,
        }, className), onClick: ({ target }) => {
            target instanceof HTMLElement &&
                target.id === 'modalMobileLayout-root' &&
                onOverlayClick &&
                onOverlayClick();
        } },
        React.createElement("div", { className: classes.container },
            onCloseButtonClick && (React.createElement("div", { className: classes.close },
                React.createElement(IconButton, { dataHook: "modalMobileLayout-close-button", skin: "light", onClick: onCloseButtonClick },
                    React.createElement(icons.X, null)))),
            title && stickyTitle && React.createElement(Title, { isSticky: true }, title),
            React.createElement("div", { className: classes.content, "data-hook": "modalMobileLayout-content" },
                React.createElement("div", null,
                    title && !stickyTitle && React.createElement(Title, null, title),
                    content,
                    footer && !stickyFooter && React.createElement(Footer, null, footer))),
            footer && stickyFooter && React.createElement(Footer, { isSticky: true }, footer))));
};
ModalMobileLayout.displayName = 'ModalMobileLayout';
export default ModalMobileLayout;
//# sourceMappingURL=ModalMobileLayout.js.map