text: 'use strict';
  
  Object.defineProperty(exports, "__esModule", {
    value: true
  });
  
  var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
  
  var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
  
  var _createClass2 = require('babel-runtime/helpers/createClass');
  
  var _createClass3 = _interopRequireDefault(_createClass2);
  
  var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
  
  var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
  
  var _inherits2 = require('babel-runtime/helpers/inherits');
  
  var _inherits3 = _interopRequireDefault(_inherits2);
  
  var _react = require('react');
  
  var React = _interopRequireWildcard(_react);
  
  var _reactDom = require('react-dom');
  
  var _reactDom2 = _interopRequireDefault(_reactDom);
  
  var _popper = require('popper.js');
  
  var _popper2 = _interopRequireDefault(_popper);
  
  var _libs = require('../../libs');
  
  var _checkbox = require('../checkbox');
  
  var _checkbox2 = _interopRequireDefault(_checkbox);
  
  var _Types = require('./Types');
  
  var _locale = require('../locale');
  
  var _locale2 = _interopRequireDefault(_locale);
  
  function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
  
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  
  (function () {
    var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
    enterModule && enterModule(module);
  })();
  
  var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
    return a;
  };
  
  function getPopupContainer() {
    var container = document.createElement('div');
    container.className = 'r-el-table-poper';
    container.style.zIndex = 999;
    document.body.appendChild(container);
    return container;
  }
  
  var FilterPannel = function (_Component) {
    (0, _inherits3.default)(FilterPannel, _Component);
  
    function FilterPannel(props) {
      (0, _classCallCheck3.default)(this, FilterPannel);
  
      var _this = (0, _possibleConstructorReturn3.default)(this, (FilterPannel.__proto__ || Object.getPrototypeOf(FilterPannel)).call(this, props));
  
      _this.container = getPopupContainer();
      ['handleClickOutside', 'onEnter', 'onAfterLeave'].forEach(function (fn) {
        _this[fn] = _this[fn].bind(_this);
      });
  
      _this.state = {
        filteredValue: props.filteredValue
      };
      return _this;
    }
  
    (0, _createClass3.default)(FilterPannel, [{
      key: 'componentDidMount',
      value: function componentDidMount() {
        this.renderPortal(this.renderContent(), this.container);
  
        document.addEventListener('click', this.handleClickOutside);
      }
    }, {
      key: 'componentWillReceiveProps',
      value: function componentWillReceiveProps(nextProps) {
        if (this.props.filteredValue !== nextProps.filteredValue) {
          this.setState({ filteredValue: nextProps.filteredValue });
        }
      }
    }, {
      key: 'componentDidUpdate',
      value: function componentDidUpdate() {
        this.renderPortal(this.renderContent(), this.container);
      }
    }, {
      key: 'componentWillUnmount',
      value: function componentWillUnmount() {
        this.poperIns && this.poperIns.destroy();
        _reactDom2.default.unmountComponentAtNode(this.container);
        document.removeEventListener('click', this.handleClickOutside);
        document.body.removeChild(this.container);
      }
    }, {
      key: 'handleFiltersChange',
      value: function handleFiltersChange(value) {
        this.setState({
          filteredValue: value
        });
      }
    }, {
      key: 'changeFilteredValue',
      value: function changeFilteredValue(value) {
        this.props.onFilterChange(value);
        this.props.toggleFilter();
      }
    }, {
      key: 'handleClickOutside',
      value: function handleClickOutside() {
        if (this.props.visible) {
          this.props.toggleFilter();
        }
      }
    }, {
      key: 'onEnter',
      value: function onEnter() {
        this.poperIns = new _popper2.default(this.refer, this.container, {
          placement: this.props.placement
        });
      }
    }, {
      key: 'onAfterLeave',
      value: function onAfterLeave() {
        this.poperIns.destroy();
      }
    }, {
      key: 'renderPortal',
      value: function renderPortal(element, container) {
        _reactDom2.default.render(element, container);
      }
    }, {
      key: 'renderContent',
      value: function renderContent() {
        var _this2 = this;
  
        var _props = this.props,
            multiple = _props.multiple,
            filters = _props.filters,
            visible = _props.visible;
        var filteredValue = this.state.filteredValue;
  
  
        var content = void 0;
        if (multiple) {
          content = [React.createElement(
            'div',
            { className: 'r-el-table-filter__content', key: 'content' },
            React.createElement(
              _checkbox2.default.Group,
              { value: filteredValue || [], onChange: this.handleFiltersChange.bind(this), className: 'r-el-table-filter__checkbox-group' },
              filters && filters.map(function (filter) {
                return React.createElement(_checkbox2.default, { value: filter.value, label: filter.text, key: filter.value });
              })
            )
          ), React.createElement(
            'div',
            { className: 'r-el-table-filter__bottom', key: 'bottom' },
            React.createElement(
              'button',
              {
                className: this.classNames({ 'is-disabled': !filteredValue || !filteredValue.length }),
                disabled: !filteredValue || !filteredValue.length,
                onClick: this.changeFilteredValue.bind(this, filteredValue)
              },
              _locale2.default.t('el.table.confirmFilter')
            ),
            React.createElement(
              'button',
              { onClick: this.changeFilteredValue.bind(this, null) },
              _locale2.default.t('el.table.resetFilter')
            )
          )];
        } else {
          content = React.createElement(
            'ul',
            { className: 'r-el-table-filter__list' },
            React.createElement(
              'li',
              {
                className: this.classNames('r-el-table-filter__list-item', { 'is-active': !filteredValue }),
                onClick: this.changeFilteredValue.bind(this, null)
              },
              _locale2.default.t('el.table.clearFilter')
            ),
            filters && filters.map(function (filter) {
              return React.createElement(
                'li',
                {
                  key: filter.value,
                  className: _this2.classNames('r-el-table-filter__list-item', { 'is-active': filter.value === filteredValue }),
                  onClick: _this2.changeFilteredValue.bind(_this2, filter.value)
                },
                filter.text
              );
            })
          );
        }
  
        return React.createElement(
          _libs.Transition,
          {
            name: 'r-el-zoom-in-top',
            onEnter: this.onEnter,
            onAfterLeave: this.onAfterLeave
          },
          React.createElement(
            _libs.View,
            { show: visible },
            React.createElement(
              'div',
              {
                className: 'r-el-table-filter',
                ref: function ref(dom) {
                  _this2.poper = dom;
                },
                onClick: function onClick(e) {
                  e.nativeEvent.stopImmediatePropagation();
                } // prevent document click event
              },
              content
            )
          )
        );
      }
    }, {
      key: 'render',
      value: function render() {
        var _this3 = this;
  
        return React.cloneElement(this.props.children, {
          ref: function ref(dom) {
            _this3.refer = dom;
          }
        });
      }
    }, {
      key: '__reactstandin__regenerateByEval',
      // @ts-ignore
      value: function __reactstandin__regenerateByEval(key, code) {
        // @ts-ignore
        this[key] = eval(code);
      }
    }]);
    return FilterPannel;
  }(_libs.Component);
  
  var _default = FilterPannel;
  exports.default = _default;
  ;
  
  (function () {
    var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;
  
    if (!reactHotLoader) {
      return;
    }
  
    reactHotLoader.register(getPopupContainer, 'getPopupContainer', 'src/table/FilterPannel.jsx');
    reactHotLoader.register(FilterPannel, 'FilterPannel', 'src/table/FilterPannel.jsx');
    reactHotLoader.register(_default, 'default', 'src/table/FilterPannel.jsx');
  })();
  
  ;
  
  (function () {
    var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;
    leaveModule && leaveModule(module);
  })();