'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');

var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);

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 _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _Checkbox = require('@material-ui/core/Checkbox');

var _Checkbox2 = _interopRequireDefault(_Checkbox);

var _CheckBox = require('@material-ui/icons/CheckBox');

var _CheckBox2 = _interopRequireDefault(_CheckBox);

var _CheckBoxOutlineBlank = require('@material-ui/icons/CheckBoxOutlineBlank');

var _CheckBoxOutlineBlank2 = _interopRequireDefault(_CheckBoxOutlineBlank);

var _FormGroup = require('@material-ui/core/FormGroup');

var _FormGroup2 = _interopRequireDefault(_FormGroup);

var _FormControlLabel = require('@material-ui/core/FormControlLabel');

var _FormControlLabel2 = _interopRequireDefault(_FormControlLabel);

var _List = require('@material-ui/icons/List');

var _List2 = _interopRequireDefault(_List);

var _styles = require('@material-ui/core/styles');

var _reactIntl = require('react-intl');

var _FilterSection = require('./FilterSection');

var _FilterSection2 = _interopRequireDefault(_FilterSection);

var _OnlyButton = require('./OnlyButton');

var _OnlyButton2 = _interopRequireDefault(_OnlyButton);

var _intl_helpers = require('../../util/intl_helpers');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

// import {FIELD_TYPE_BOOLEAN, FIELD_TYPE_NUMBER} from '../../constants'

var styles = {
  formGroup: {
    paddingBottom: 8
  },
  formControlRoot: {
    lineHeight: '22px',
    padding: '2px 16px',
    boxSizing: 'border-box',
    width: '100%',
    minWidth: 0,
    marginRight: 0,
    marginLeft: 0
  },
  formControlLabel: {
    whiteSpace: 'nowrap',
    overflow: 'hidden',
    textOverflow: 'ellipsis'
  },
  coloredSpan: {
    backgroundColor: 'rgb(0, 188, 212)',
    borderRadius: 2,
    padding: '2px 5px',
    color: 'white',
    letterSpacing: '0.02em',
    fontSize: 13,
    lineHeight: '24px'
  },
  showAll: {
    top: 6,
    fontSize: 12
  },
  checkboxItem: {
    display: 'flex',
    justifyContent: 'space-between'
  },
  checkboxButton: {
    width: 24,
    height: 24,
    marginRight: 16
  },
  checkboxIcon: {
    width: 20,
    height: 20
  }
};

var DiscreteFilter = function (_React$PureComponent) {
  (0, _inherits3.default)(DiscreteFilter, _React$PureComponent);

  function DiscreteFilter() {
    var _ref;

    var _temp, _this, _ret;

    (0, _classCallCheck3.default)(this, DiscreteFilter);

    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = DiscreteFilter.__proto__ || (0, _getPrototypeOf2.default)(DiscreteFilter)).call.apply(_ref, [this].concat(args))), _this), _this.state = {}, _this.showAll = function (e) {
      e.preventDefault();
      _this.props.onUpdate({
        exp: 'in',
        key: _this.props.fieldName,
        val: null
      });
    }, _this.handleCheck = function (value, e) {
      var checked = _this.props.checked.slice(0);
      if (e.target.checked && checked.indexOf(value) === -1) {
        checked.push(value);
      } else if (!e.target.checked && checked.indexOf(value) > -1) {
        checked.splice(checked.indexOf(value), 1);
      }
      _this.props.onUpdate({
        exp: 'in',
        key: _this.props.fieldName,
        val: checked
      });
    }, _this.handleMouseLeave = function () {
      _this.setState({ hovered: false });
    }, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
  }

  (0, _createClass3.default)(DiscreteFilter, [{
    key: 'handleOnlyClick',
    value: function handleOnlyClick(key, e) {
      e.preventDefault();
      this.props.onUpdate({
        exp: 'in',
        key: this.props.fieldName,
        val: [key]
      });
    }
  }, {
    key: 'handleMouseEnter',
    value: function handleMouseEnter(key) {
      this.setState({ hovered: key });
    }
  }, {
    key: 'render',
    value: function render() {
      var _this2 = this;

      var _props = this.props,
          fieldName = _props.fieldName,
          checked = _props.checked,
          values = _props.values,
          classes = _props.classes,
          colored = _props.colored,
          colorIndex = _props.colorIndex,
          formatMessage = _props.intl.formatMessage;

      var isFiltered = checked.length < values.length;
      var title = fieldName.split('.').slice(-1)[0];
      var subtitle = fieldName.indexOf('.') > 1 ? fieldName.split('.').slice(0, -1).join(' / ') : null;

      return _react2.default.createElement(
        _FilterSection2.default,
        {
          title: formatMessage((0, _intl_helpers.createMessage)('field_key')(title)),
          subtitle: subtitle && formatMessage((0, _intl_helpers.createMessage)('field_key')(subtitle)),
          icon: _react2.default.createElement(_List2.default, null),
          isFiltered: isFiltered,
          showAll: this.showAll },
        _react2.default.createElement(
          _FormGroup2.default,
          { className: classes.formGroup },
          values.map(function (v, i) {
            return _react2.default.createElement(
              'div',
              {
                className: classes.checkboxItem,
                key: v.value,
                onMouseEnter: function onMouseEnter() {
                  return _this2.handleMouseEnter(v.value);
                },
                onMouseLeave: _this2.handleMouseLeave },
              _react2.default.createElement(_FormControlLabel2.default, {
                classes: { root: classes.formControlRoot, label: classes.formControlLabel },
                control: _react2.default.createElement(_Checkbox2.default, {
                  classes: { root: classes.checkboxButton },
                  checked: checked.indexOf(v.value) > -1,
                  icon: _react2.default.createElement(_CheckBoxOutlineBlank2.default, { classes: { root: classes.checkboxIcon } }),
                  checkedIcon: _react2.default.createElement(_CheckBox2.default, { classes: { root: classes.checkboxIcon } }),
                  onChange: function onChange(e) {
                    return _this2.handleCheck(v.value, e);
                  }
                }),
                label: _react2.default.createElement(
                  'span',
                  {
                    className: colored ? classes.coloredSpan : '',
                    style: colored ? { backgroundColor: colorIndex[v.value] } : null,
                    title: formatMessage((0, _intl_helpers.createMessage)('field_value')(v.value)) },
                  formatMessage((0, _intl_helpers.createMessage)('field_value')(v.value))
                )
              }),
              _this2.state.hovered === v.value && _react2.default.createElement(_OnlyButton2.default, { onClick: function onClick(e) {
                  return _this2.handleOnlyClick(v.value, e);
                } })
            );
          })
        )
      );
    }
  }]);
  return DiscreteFilter;
}(_react2.default.PureComponent);

DiscreteFilter.propTypes = {
  fieldName: _propTypes2.default.string.isRequired,
  checked: _propTypes2.default.array,
  values: _propTypes2.default.arrayOf(_propTypes2.default.object),
  onUpdate: _propTypes2.default.func
};
DiscreteFilter.defaultProps = {
  checked: [],
  onUpdate: function onUpdate(x) {
    return x;
  }
};
exports.default = (0, _styles.withStyles)(styles)((0, _reactIntl.injectIntl)(DiscreteFilter));
//# sourceMappingURL=DiscreteFilter.js.map