@itwin/core-react/lib/core-react/messagebox/MessageBox.js

A react component library of iTwin.js UI general purpose components

/*---------------------------------------------------------------------------------------------
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
/** @packageDocumentation
 * @module Dialog
 */
import "./MessageBox.scss";
import classnames from "classnames";
import * as React from "react";
import { MessageSeverity } from "@itwin/appui-abstract";
import { SvgHelpCircular, SvgHelpCircularHollow, SvgInfoCircular, SvgInfoCircularHollow, SvgStatusError, SvgStatusErrorHollow, SvgStatusRejected, SvgStatusRejectedHollow, SvgStatusSuccess, SvgStatusSuccessHollow, SvgStatusWarning, } from "@itwin/itwinui-icons-react";
import { Icon } from "@itwin/itwinui-react";
import { Dialog } from "../dialog/Dialog.js";
/** Message Box React component.
 * @public
 * @deprecated in 4.15.0. Use {@link https://itwinui.bentley.com/docs/dialog iTwinUI Dialog} instead.
 */
export class MessageBox extends React.PureComponent {
    static defaultProps = {
        minWidth: 400,
        minHeight: 400,
        width: "512px",
        modal: true,
    };
    render() {
        return (React.createElement(Dialog, { title: this.props.title, buttonCluster: this.props.buttonCluster, opened: this.props.opened, onClose: this.props.onClose, onEscape: this.props.onEscape, modal: this.props.modal, className: this.props.className, style: this.props.style, width: this.props.width },
            React.createElement(MessageContainer, { severity: this.props.severity, className: this.props.contentClassName, style: this.props.contentStyle }, this.props.children)));
    }
}
/** Message Container React component.
 * @public
 * @deprecated in 4.15.0. Use {@link https://itwinui.bentley.com/docs/dialog iTwinUI Dialog} instead.
 */
export class MessageContainer extends React.PureComponent {
    static getIconClassName(severity, _hollow) {
        let iconClassName = "";
        switch (severity) {
            case MessageSeverity.None:
                iconClassName = "";
                break;
            case MessageSeverity.Success:
                iconClassName = "core-message-box-success";
                break;
            case MessageSeverity.Information:
                iconClassName = "core-message-box-information";
                break;
            case MessageSeverity.Question:
                iconClassName = "core-message-box-question";
                break;
            case MessageSeverity.Warning:
                iconClassName = "core-message-box-warning";
                break;
            case MessageSeverity.Error:
                iconClassName = "core-message-box-error";
                break;
            case MessageSeverity.Fatal:
                iconClassName = "core-message-box-fatal";
                break;
        }
        return iconClassName;
    }
    /** Returns the React icon corresponding to the MessageSeverity.
     * @param severity MessageSeverity
     * @param hollow set to true to return the hollow form of the icon.
     * @returns IconSpec
     */
    /* ignore for unit tests and replace with visual testing */
    static getIcon(severity, hollow) {
        const icon = getIcon(severity, hollow);
        return icon ?? "";
    }
    render() {
        const iconClassName = classnames("icon", "core-message-box-icon", MessageContainer.getIconClassName(this.props.severity));
        const icon = getIcon(this.props.severity);
        return (React.createElement("div", { className: "core-message-box-container" },
            icon ? (React.createElement(Icon, { className: iconClassName, size: "large", fill: toFill(this.props.severity) }, icon)) : undefined,
            React.createElement("div", { className: classnames("core-message-box-content", this.props.className), style: this.props.style }, this.props.children)));
    }
}
function getIcon(severity, hollow) {
    switch (severity) {
        case MessageSeverity.None:
            return undefined;
        case MessageSeverity.Success:
            return hollow ? React.createElement(SvgStatusSuccessHollow, null) : React.createElement(SvgStatusSuccess, null);
        case MessageSeverity.Information:
            return hollow ? React.createElement(SvgInfoCircularHollow, null) : React.createElement(SvgInfoCircular, null);
        case MessageSeverity.Question:
            return hollow ? React.createElement(SvgHelpCircularHollow, null) : React.createElement(SvgHelpCircular, null);
        case MessageSeverity.Warning:
            return React.createElement(SvgStatusWarning, null); // TODO - need icon-status-warning-hollow icon
        case MessageSeverity.Error:
            return hollow ? React.createElement(SvgStatusErrorHollow, null) : React.createElement(SvgStatusError, null);
            break;
        case MessageSeverity.Fatal:
            return hollow ? React.createElement(SvgStatusRejectedHollow, null) : React.createElement(SvgStatusRejected, null);
    }
}
function toFill(severity) {
    switch (severity) {
        case MessageSeverity.None:
            return undefined;
        case MessageSeverity.Success:
            return "positive";
        case MessageSeverity.Information:
        case MessageSeverity.Question:
            return "informational";
        case MessageSeverity.Warning:
            return "warning";
        case MessageSeverity.Error:
        case MessageSeverity.Fatal:
            return "negative";
    }
    return undefined;
}
//# sourceMappingURL=MessageBox.js.map