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 classnames from "classnames";
import * as React from "react";
import * as _ from "lodash";
import { CSSTransition, TransitionGroup } from "react-transition-group";
import { ToastNotification } from "./ToastNotification";
import "./ToastStack.less";
var defaultProps = {
    defaultNotificationDurationMS: 5000,
};
var cssClass = {
    CONTAINER: "ToastStack",
    NOTIFICATION_WRAPPER: "ToastStack--notificationWrapper",
    ANIMATION: "ToastStack--animation",
};
/**
 * Toast notifications can be used to provide feedback in response to user interaction. The
 * <ToastStack> renders toast notifications and handles their enter/leave animations.
 */
var ToastStack = /** @class */ (function (_super) {
    __extends(ToastStack, _super);
    function ToastStack() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    ToastStack.prototype._finiteDuration = function (notification) {
        var defaultNotificationDurationMS = this.props.defaultNotificationDurationMS;
        if (notification.durationMS) {
            return notification.durationMS !== Infinity;
        }
        return defaultNotificationDurationMS !== Infinity;
    };
    ToastStack.prototype.componentDidUpdate = function (prevProps) {
        var _this = this;
        var _a = this.props, clearNotification = _a.clearNotification, defaultNotificationDurationMS = _a.defaultNotificationDurationMS;
        var prevNotifications = prevProps.notifications || [];
        var currNotifications = this.props.notifications || [];
        var newNotificationIDs = _.difference(currNotifications.map(function (n) { return n.id; }), prevNotifications.map(function (n) { return n.id; }));
        // If a notification was just added to the stack and has a finite duration, set up a timer to
        // clear it
        currNotifications.forEach(function (n) {
            if (newNotificationIDs.includes(n.id) && _this._finiteDuration(n)) {
                window.setTimeout(function () { return clearNotification(n.id); }, n.durationMS || defaultNotificationDurationMS);
            }
        });
    };
    ToastStack.prototype.render = function () {
        var _a = this.props, className = _a.className, clearNotification = _a.clearNotification, notificationClassName = _a.notificationClassName, notifications = _a.notifications;
        var toasts = notifications.map(function (n) { return (React.createElement(CSSTransition, { timeout: {
                enter: 200,
                exit: 400,
            }, classNames: cssClass.ANIMATION, className: cssClass.NOTIFICATION_WRAPPER, key: n.id },
            React.createElement(ToastNotification, { action: n.action, className: notificationClassName, onClose: function () { return clearNotification(n.id); }, showCloseButton: n.showCloseButton, type: n.type, closeButtonAriaLabel: n.closeButtonAriaLabel }, n.content))); });
        return (React.createElement(TransitionGroup, { className: classnames(cssClass.CONTAINER, className) }, toasts));
    };
    ToastStack.defaultProps = defaultProps;
    return ToastStack;
}(React.PureComponent));
export { ToastStack };
