'use client';

import React, {FC} from 'react';
import {ModalComponents as S} from './modal.style';
import {IModalProps} from './modal.type';
import Close from 'herein-icon/x-close';

/**
 *
 * @author AudreyBozorgi
 * @version 0.0.2
 * @description A React component that renders a moda.
 * @madeUse Emotion
 */
export const ModalComponent: FC<IModalProps> = ({
    children,
    open,
    isRtl,
    onClose,
    ...rest
}) => {
    return (
        <S.Container
            open={open}
            onClose={onClose}
            aria-labelledby='parent-modal-title'
            aria-describedby='parent-modal-description'
            {...rest}
        >
            <S.StyledModal isRtl={isRtl}>
                <S.CloseIconWrapper isRtl={isRtl} onClick={onClose}>
                    <Close />
                </S.CloseIconWrapper>
                {children}
            </S.StyledModal>
        </S.Container>
    );
};