define(["require", "exports", "tslib", "react", "../../Utilities", "../../Button", "../../Icon", "./MessageBar.Props", "./MessageBar.scss"], function (require, exports, tslib_1, React, Utilities_1, Button_1, Icon_1, MessageBar_Props_1, stylesImport) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var styles = stylesImport;
    var MessageBar = (function (_super) {
        tslib_1.__extends(MessageBar, _super);
        function MessageBar(props) {
            var _this = _super.call(this, props) || this;
            _this.ICON_MAP = (_a = {},
                _a[MessageBar_Props_1.MessageBarType.info] = 'Info',
                _a[MessageBar_Props_1.MessageBarType.warning] = 'Info',
                _a[MessageBar_Props_1.MessageBarType.error] = 'ErrorBadge',
                _a[MessageBar_Props_1.MessageBarType.blocked] = 'Blocked',
                _a[MessageBar_Props_1.MessageBarType.remove] = 'Blocked',
                _a[MessageBar_Props_1.MessageBarType.severeWarning] = 'Warning',
                _a[MessageBar_Props_1.MessageBarType.success] = 'Completed',
                _a);
            _this.state = {
                labelId: Utilities_1.getId('MessageBar'),
                showContent: false
            };
            return _this;
            var _a;
        }
        MessageBar.prototype.render = function () {
            var isMultiline = this.props.isMultiline;
            return isMultiline ? this._renderMultiLine() : this._renderSingleLine();
        };
        MessageBar.prototype._getActionsDiv = function () {
            if (this.props.actions) {
                return React.createElement("div", { className: this.props.isMultiline ?
                        ('ms-MessageBar-actions ' + styles.actions) :
                        ('ms-MessageBar-actionsOneline ' + styles.actionsOneline) }, this.props.actions);
            }
            return null;
        };
        MessageBar.prototype._getClassName = function () {
            return Utilities_1.css(this.props.className, 'ms-MessageBar', styles.root, (_a = {},
                _a['ms-MessageBar ' + styles.root] = this.props.messageBarType === MessageBar_Props_1.MessageBarType.info,
                _a['ms-MessageBar--error ' + styles.rootIsError] = this.props.messageBarType === MessageBar_Props_1.MessageBarType.error,
                _a['ms-MessageBar--blocked ' + styles.rootIsBlocked] = (this.props.messageBarType === MessageBar_Props_1.MessageBarType.blocked) ||
                    (this.props.messageBarType === MessageBar_Props_1.MessageBarType.remove),
                _a['ms-MessageBar--severeWarning ' + styles.rootIsSevereWarning] = this.props.messageBarType === MessageBar_Props_1.MessageBarType.severeWarning,
                _a['ms-MessageBar--success ' + styles.rootIsSuccess] = this.props.messageBarType === MessageBar_Props_1.MessageBarType.success,
                _a['ms-MessageBar--warning ' + styles.rootIsWarning] = this.props.messageBarType === MessageBar_Props_1.MessageBarType.warning,
                _a));
            var _a;
        };
        MessageBar.prototype._getDismissDiv = function () {
            if (this.props.onDismiss) {
                return (React.createElement(Button_1.IconButton, { disabled: false, className: Utilities_1.css('ms-MessageBar-dismissal', styles.dismissal), onClick: this.props.onDismiss, iconProps: { iconName: 'Cancel' }, ariaLabel: this.props.dismissButtonAriaLabel }));
            }
            return null;
        };
        MessageBar.prototype._getDismissOneLine = function () {
            if (this.props.onDismiss) {
                return (React.createElement("div", { className: Utilities_1.css('ms-MessageBar-dismissOneline', styles.dismissOneline) }, this._getDismissDiv()));
            }
            return null;
        };
        MessageBar.prototype._getIconSpan = function () {
            return (React.createElement("div", { className: Utilities_1.css('ms-MessageBar-icon', styles.icon) },
                React.createElement(Icon_1.Icon, { iconName: this.ICON_MAP[this.props.messageBarType] })));
        };
        MessageBar.prototype._getInnerTextClassName = function () {
            return this.props.onDismiss || this.props.actions ?
                'ms-MessageBar-innerTextPadding ' + styles.innerTextPadding : 'ms-MessageBar-innerText ' + styles.innerText;
        };
        MessageBar.prototype._renderMultiLine = function () {
            return (React.createElement("div", { className: Utilities_1.css(this._getClassName(), 'ms-MessageBar-multiline', styles.multiline, this.props.onDismiss && styles.dismissalMultiline, this.props.actions && styles.actionableMultiline), role: 'status', "aria-live": this._getAnnouncementPriority() },
                React.createElement("div", { className: Utilities_1.css(styles.content, 'ms-MessageBar-content') },
                    this._getIconSpan(),
                    this._renderInnerText(),
                    this._getDismissDiv()),
                this._getActionsDiv()));
        };
        MessageBar.prototype._renderSingleLine = function () {
            return (React.createElement("div", { className: Utilities_1.css(this._getClassName(), 'ms-MessageBar-singleline', styles.singleline, this.props.onDismiss && 'ms-MessageBar-dismissalOneline ' + styles.dismissalOneline, this.props.actions && styles.actionableOneline) },
                React.createElement("div", { className: Utilities_1.css(styles.content, 'ms-MessageBar-content') },
                    this._getIconSpan(),
                    this._renderInnerText(),
                    this._getDismissOneLine()),
                this._getActionsDiv()));
        };
        MessageBar.prototype._renderInnerText = function () {
            return (React.createElement("div", { className: Utilities_1.css('ms-MessageBar-text', styles.text), id: this.state.labelId },
                React.createElement("span", { className: this._getInnerTextClassName(), role: 'status', "aria-live": this._getAnnouncementPriority() },
                    React.createElement(Utilities_1.DelayedRender, null,
                        React.createElement("span", null, this.props.children)))));
        };
        MessageBar.prototype._getAnnouncementPriority = function () {
            switch (this.props.messageBarType) {
                case MessageBar_Props_1.MessageBarType.blocked:
                case MessageBar_Props_1.MessageBarType.error:
                case MessageBar_Props_1.MessageBarType.severeWarning:
                    return 'assertive';
            }
            return 'polite';
        };
        return MessageBar;
    }(Utilities_1.BaseComponent));
    MessageBar.defaultProps = {
        messageBarType: MessageBar_Props_1.MessageBarType.info,
        onDismiss: undefined,
        isMultiline: true,
    };
    exports.MessageBar = MessageBar;
});

//# sourceMappingURL=MessageBar.js.map
