import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { SideDialogTitle } from '../SideDialogTitle';
import { useViewportType } from '../useViewportType';
import { StyledBottomDrawer, StyledDrawer } from './styles';
export const SideDialog = ({ children, title, onClose, open, size = 'sm', ...props }) => {
    const { isMobile } = useViewportType();
    if (isMobile) {
        return (_jsx(StyledBottomDrawer, { onClose: onClose, title: title, open: open, ...props, children: children }));
    }
    return (_jsxs(StyledDrawer, { "$size": size, anchor: "right", open: open, onClose: onClose, ...props, children: [title && _jsx(SideDialogTitle, { onClose: onClose, children: title }), children] }));
};
