@mindhive/documents/src/search/SearchFilter.js

Standard document viewing, editing, listing etc

'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 _react2 = _interopRequireDefault(_react);

var _TextField = require('material-ui/TextField');

var _TextField2 = _interopRequireDefault(_TextField);

var _SearchIcon = require('./SearchIcon');

var _SearchIcon2 = _interopRequireDefault(_SearchIcon);

var _SearchStyles = require('./SearchStyles');

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

var SearchFilter = function (_Component) {
  (0, _inherits3.default)(SearchFilter, _Component);

  function SearchFilter() {
    var _ref;

    var _temp, _this, _ret;

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

    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 = SearchFilter.__proto__ || Object.getPrototypeOf(SearchFilter)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
      searchText: ''
    }, _this.handleChange = function (event) {
      var searchText = event.target.value;

      // Make sure that we have a new searchText.
      // Fix an issue with a Cordova Webview
      if (searchText === _this.state.searchText) {
        return;
      }

      _this.setState({
        searchText: searchText
      }, function () {
        _this.props.onSearch(searchText);
      });
    }, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
  }

  (0, _createClass3.default)(SearchFilter, [{
    key: 'render',
    value: function render() {
      var _props = this.props,
          styles = _props.styles,
          hintText = _props.hintText,
          _props$fullWidth = _props.fullWidth,
          fullWidth = _props$fullWidth === undefined ? false : _props$fullWidth,
          _props$searching = _props.searching,
          searching = _props$searching === undefined ? false : _props$searching;
      var searchText = this.state.searchText;

      return _react2.default.createElement(
        'div',
        { style: styles.container },
        _react2.default.createElement(_SearchIcon2.default, { searching: searching }),
        _react2.default.createElement(_TextField2.default, {
          ref: 'searchTextField',
          autoComplete: 'off',
          value: searchText,
          style: styles.textField,
          hintText: hintText || 'Filter list',
          onChange: this.handleChange,
          autoFocus: true,
          fullWidth: fullWidth
        })
      );
    }
  }]);
  return SearchFilter;
}(_react.Component);

exports.default = (0, _SearchStyles.injectStylesSheet)(SearchFilter);