@yandex/ui/esm/Modal/Modal.js

Yandex UI components

import { __assign, __rest } from "tslib";
import React, { useRef } from 'react';
import { useComponentRegistry } from '@bem-react/di';
import { cn } from '@bem-react/classname';
import { usePreventScroll } from '../usePreventScroll';
import './Modal.css';
export var cnModal = cn('Modal');
/**
 * Используется для создания всплывающих модальных окон.
 * @param {IModalProps} props
 */
export var Modal = function (_a) {
    var children = _a.children, className = _a.className, _b = _a.contentVerticalAlign, align = _b === void 0 ? 'middle' : _b, _c = _a.hasAnimation, hasAnimation = _c === void 0 ? true : _c, visible = _a.visible, _d = _a.preventBodyScroll, preventBodyScroll = _d === void 0 ? true : _d, onClick = _a.onClick, props = __rest(_a, ["children", "className", "contentVerticalAlign", "hasAnimation", "visible", "preventBodyScroll", "onClick"]);
    var contentRef = useRef(null);
    var Popup = useComponentRegistry(cnModal()).Popup;
    usePreventScroll({ enabled: preventBodyScroll && visible });
    return (React.createElement(Popup, __assign({}, props, { className: cnModal({ visible: visible, hasAnimation: hasAnimation }, [className]), visible: visible, unstable_hostRef: contentRef, onClick: onClick }),
        React.createElement("div", { className: cnModal('Overlay') }),
        React.createElement("div", { className: cnModal('Wrapper') },
            React.createElement("div", { className: cnModal('Table') },
                React.createElement("div", { className: cnModal('Cell', { align: align }) },
                    React.createElement("div", { ref: contentRef, className: cnModal('Content') }, children))))));
};
Modal.displayName = cnModal();