@yandex/ui/esm/MessageBox/MessageBox.js

Yandex UI components

import React from 'react';
import { cn } from '@bem-react/classname';
import { MessageBoxClose as Close } from './Close/MessageBox-Close';
import { MessageBoxButtons as Buttons } from './Buttons/MessageBox-Buttons';
import { MessageBoxTail as Tail } from './Tail/MessageBox-Tail';
import './MessageBox.css';
export { MessageBoxCorner as Corner } from './Corner/MessageBox-Corner';
export { MessageBoxTextWrap as Wrapper } from './TextWrap/MessageBox-TextWrap';
export var cnMessageBox = cn('MessageBox');
/**
 * Визуальный компонент для уведомлений, плашек и других паттернов.
 * @param {MessageBoxProps} props
 */
export var MessageBox = function (_a) {
    var actions = _a.actions, background = _a.background, children = _a.children, className = _a.className, corner = _a.corner, hasTail = _a.hasTail, innerRef = _a.innerRef, _b = _a.layout, layout = _b === void 0 ? 'plain' : _b, onClose = _a.onClose, opaque = _a.opaque, tailRef = _a.tailRef, _c = _a.tailType, tailType = _c === void 0 ? 'default' : _c;
    return (React.createElement("div", { className: cnMessageBox({ opaque: opaque, layout: layout, hasClose: Boolean(onClose) }, [className]), ref: innerRef },
        React.createElement("div", { className: cnMessageBox('Backdrop') },
            hasTail && React.createElement(Tail, { innerRef: tailRef, tailType: tailType }),
            background && React.createElement("div", { className: cnMessageBox('Background') }, background)),
        React.createElement("div", { className: cnMessageBox('Content') },
            children,
            onClose && React.createElement(Close, { onClick: onClose })),
        actions && React.createElement(Buttons, null, actions),
        corner));
};
MessageBox.displayName = 'MessageBox';