@yandex/ui
Version:
Yandex UI components
29 lines (28 loc) • 2.05 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Modal = exports.cnModal = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var di_1 = require("@bem-react/di");
var classname_1 = require("@bem-react/classname");
var usePreventScroll_1 = require("../usePreventScroll");
require("./Modal.css");
exports.cnModal = classname_1.cn('Modal');
/**
* Используется для создания всплывающих модальных окон.
* @param {IModalProps} props
*/
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 = tslib_1.__rest(_a, ["children", "className", "contentVerticalAlign", "hasAnimation", "visible", "preventBodyScroll", "onClick"]);
var contentRef = react_1.useRef(null);
var Popup = di_1.useComponentRegistry(exports.cnModal()).Popup;
usePreventScroll_1.usePreventScroll({ enabled: preventBodyScroll && visible });
return (react_1.default.createElement(Popup, tslib_1.__assign({}, props, { className: exports.cnModal({ visible: visible, hasAnimation: hasAnimation }, [className]), visible: visible, unstable_hostRef: contentRef, onClick: onClick }),
react_1.default.createElement("div", { className: exports.cnModal('Overlay') }),
react_1.default.createElement("div", { className: exports.cnModal('Wrapper') },
react_1.default.createElement("div", { className: exports.cnModal('Table') },
react_1.default.createElement("div", { className: exports.cnModal('Cell', { align: align }) },
react_1.default.createElement("div", { ref: contentRef, className: exports.cnModal('Content') }, children))))));
};
exports.Modal = Modal;
exports.Modal.displayName = exports.cnModal();