ldx-widgets/dist/components/form_alert_item.js

widgets

(function() {
  var FormAlertItem, PropTypes, React, button, createClass, div, li, ref;

  React = require('react');

  createClass = require('create-react-class');

  PropTypes = require('prop-types');

  ref = require('react-dom-factories'), li = ref.li, div = ref.div, button = ref.button;

  FormAlertItem = createClass({
    displayName: 'FormAlertItem',
    propTypes: {
      isAlert: PropTypes.bool,
      message: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
    },
    getInitialState: function() {
      return {
        leave: false,
        enter: true
      };
    },
    componentDidMount: function() {
      var removeTimer;
      removeTimer = this.props.alert.removeTimer;
      if (removeTimer != null) {
        setTimeout(this.handleRemove, removeTimer);
      }
      return this.rootEl.addEventListener('animationend', this.didEnter);
    },
    render: function() {
      var alert, className, enter, isAlert, leave, message, ref1;
      alert = this.props.alert;
      isAlert = alert.isAlert, message = alert.message;
      ref1 = this.state, enter = ref1.enter, leave = ref1.leave;
      className = isAlert ? 'alert' : 'success';
      if (enter) {
        className += ' animate-in';
      }
      if (leave) {
        className += ' animate-out';
      }
      return li({
        className: className,
        ref: (function(_this) {
          return function(rootEl) {
            _this.rootEl = rootEl;
          };
        })(this)
      }, [
        div({
          key: 'title',
          className: 'message'
        }, [
          div({
            key: 'message',
            className: 'alert-text',
            title: message
          }, message), button({
            key: 'remove-item',
            onClick: this.handleRemove,
            className: 'alert-close'
          })
        ])
      ]);
    },
    didEnter: function() {
      this.rootEl.removeEventListener('animationend', this.didEnter);
      return this.setState({
        enter: false
      });
    },
    handleRemove: function() {
      this.rootEl.addEventListener('animationend', this.removeAlert);
      return this.setState({
        leave: true
      });
    },
    removeAlert: function() {
      this.rootEl.removeEventListener('animationend', this.removeAlert);
      return this.props.removeAlert(this.props.alert);
    }
  });

  module.exports = FormAlertItem;

}).call(this);