gorbenko.pavel
da158cfd84
Tests / test (push) Successful in 2m26s
Co-authored-by: gorbenko.pavel <gorbenko.pavel@tansu.kz> Reviewed-on: http://git.tnsu.kz/gorbenko.pavel/tnsu-approval-route/pulls/5
26 lines
970 B
TypeScript
26 lines
970 B
TypeScript
import * as React from 'react';
|
|
import styles from './Modal.module.scss';
|
|
import { IconButton } from './IconButton';
|
|
import { texts } from '../../texts';
|
|
|
|
export interface IModalProps {
|
|
title: string;
|
|
onClose: () => void;
|
|
footer?: React.ReactNode;
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
export const Modal: React.FC<IModalProps> = ({ title, onClose, footer, children }) => (
|
|
// Клик по подложке закрывает окно, клик внутри — нет (проверяем сам currentTarget).
|
|
<div className={styles.overlay} onClick={e => { if (e.target === e.currentTarget) onClose(); }}>
|
|
<div className={styles.box}>
|
|
<div className={styles.header}>
|
|
<div className={styles.title}>{title}</div>
|
|
<IconButton icon="close" label={texts.common.close} onClick={onClose} />
|
|
</div>
|
|
<div className={styles.body}>{children}</div>
|
|
{footer && <div className={styles.footer}>{footer}</div>}
|
|
</div>
|
|
</div>
|
|
);
|