var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
import * as React from 'react';
import { TransitionablePortal, Message, Icon } from 'semantic-ui-react';
var AlertCompo = /** @class */ (function (_super) {
    __extends(AlertCompo, _super);
    function AlertCompo(props) {
        var _this = _super.call(this, props) || this;
        _this.state = { message: '', show: false };
        props.showMessage(function (msg) {
            _this.setState({
                message: msg,
                show: true
            });
        });
        return _this;
    }
    AlertCompo.prototype.componentDidUpdate = function () {
        var _this = this;
        if (this.state && this.state.show) {
            setTimeout(function () {
                _this.setState({ show: false });
            }, 1000);
        }
    };
    AlertCompo.prototype.render = function () {
        return <TransitionablePortal open={this.state.show} transition={{ animation: "fade", duration: 1000 }}>
            <Message compact style={{ paddingTop: 4, paddingBottom: 4, right: '1em', top: '3.8em', position: 'fixed', zIndex: 1000 }} size="mini" info>
            <Icon name="info"/>
            {this.state.message}
            </Message>
        </TransitionablePortal>;
    };
    return AlertCompo;
}(React.Component));
export var showMessage = function (message) { };
var _showMessage = function (cb) {
    showMessage = cb;
};
export var Alert = function () { return <AlertCompo showMessage={_showMessage}/>; };