import { jsx, jsxs } from "react/jsx-runtime";
import Close from "@mui/icons-material/Close";
import { Box, Modal } from "@mui/material";
import apollo_core from "@uipath/apollo-core";
import react, { useCallback } from "react";
import { ApButton } from "../ap-button/index.js";
import { ApIconButton } from "../ap-icon-button/index.js";
import { ApTypography } from "../ap-typography/index.js";
const getSizeWidth = (size)=>{
    switch(size){
        case 'small':
            return '480px';
        case 'medium':
            return '600px';
        case 'large':
            return '800px';
        default:
            return '480px';
    }
};
const ApModal = /*#__PURE__*/ react.forwardRef((props, ref)=>{
    const { header, message, size = 'small', open, preventClose, hideCloseButton, primaryAction, secondaryAction, closeButtonId, onClose, children, ...rest } = props;
    const handleClose = useCallback((event, reason)=>{
        if (preventClose) return;
        onClose?.(event, reason);
    }, [
        preventClose,
        onClose
    ]);
    const handleCloseButtonClick = useCallback(()=>{
        if (preventClose) return;
        onClose?.({}, 'closeButtonClick');
    }, [
        preventClose,
        onClose
    ]);
    const hasActions = primaryAction || secondaryAction;
    return /*#__PURE__*/ jsx(Modal, {
        ref: ref,
        disablePortal: true,
        open: open,
        onClose: handleClose,
        ...rest,
        children: /*#__PURE__*/ jsxs(Box, {
            sx: {
                position: 'absolute',
                top: '50%',
                left: '50%',
                transform: 'translate(-50%, -50%)',
                width: getSizeWidth(size),
                backgroundColor: 'var(--color-background)',
                borderRadius: apollo_core.Border.BorderRadiusS,
                padding: apollo_core.Spacing.SpacingL,
                boxShadow: apollo_core.Shadow.ShadowDp8,
                '&:focus-visible, &:focus': {
                    outline: 'none'
                }
            },
            children: [
                header && /*#__PURE__*/ jsx(Box, {
                    sx: {
                        paddingTop: apollo_core.Padding.PadXl,
                        paddingBottom: apollo_core.Padding.PadL,
                        display: 'flex',
                        alignItems: 'center'
                    },
                    children: /*#__PURE__*/ jsx(ApTypography, {
                        variant: apollo_core.FontVariantToken.fontSizeH4Bold,
                        color: "var(--color-foreground)",
                        children: header
                    })
                }),
                !hideCloseButton && !preventClose && /*#__PURE__*/ jsx(Box, {
                    sx: {
                        position: 'absolute',
                        right: '10px',
                        top: '10px'
                    },
                    children: /*#__PURE__*/ jsx(ApIconButton, {
                        size: "small",
                        id: closeButtonId,
                        color: "secondary",
                        onClick: handleCloseButtonClick,
                        children: /*#__PURE__*/ jsx(Close, {
                            sx: {
                                width: apollo_core.Icon.IconXs,
                                height: apollo_core.Icon.IconXs
                            }
                        })
                    })
                }),
                message ? /*#__PURE__*/ jsx(ApTypography, {
                    variant: apollo_core.FontVariantToken.fontSizeM,
                    color: "var(--color-foreground)",
                    children: message
                }) : children,
                hasActions && /*#__PURE__*/ jsxs(Box, {
                    sx: {
                        display: 'flex',
                        justifyContent: 'flex-end',
                        paddingTop: apollo_core.Spacing.SpacingM
                    },
                    children: [
                        secondaryAction && /*#__PURE__*/ jsx(ApButton, {
                            variant: "secondary",
                            id: secondaryAction.id,
                            label: secondaryAction.label,
                            disabled: secondaryAction.disabled,
                            loading: secondaryAction.loading,
                            onClick: secondaryAction.onClick
                        }),
                        primaryAction && /*#__PURE__*/ jsx(Box, {
                            sx: {
                                paddingLeft: apollo_core.Padding.PadL
                            },
                            children: /*#__PURE__*/ jsx(ApButton, {
                                variant: "primary",
                                id: primaryAction.id,
                                label: primaryAction.label,
                                disabled: primaryAction.disabled,
                                loading: primaryAction.loading,
                                onClick: primaryAction.onClick
                            })
                        })
                    ]
                })
            ]
        })
    });
});
ApModal.displayName = 'ApModal';
export { ApModal };
