uxcore-mention/build/components/mentionMixin.js

Mention anywhere with this component

'use strict';

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

var _react = require('react');

var _keycode = require('../utils/keycode');

function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }

var BaseMention = function (_Component) {
  _inherits(BaseMention, _Component);

  function BaseMention() {
    _classCallCheck(this, BaseMention);

    return _possibleConstructorReturn(this, _Component.apply(this, arguments));
  }

  BaseMention.prototype.onPanelKeyup = function onPanelKeyup(e) {
    var _state = this.state,
        panelVisible = _state.panelVisible,
        panelIdx = _state.panelIdx,
        mentionList = _state.mentionList;

    if (panelVisible) {
      var count = mentionList.length;
      switch (e.keyCode) {
        case _keycode.KEYCODE.UP:
          this.setState({
            panelIdx: panelIdx === 0 ? count - 1 : panelIdx - 1
          });
          break;
        case _keycode.KEYCODE.DOWN:
          this.setState({
            panelIdx: panelIdx === count - 1 ? 0 : panelIdx + 1
          });
          break;
        case _keycode.KEYCODE.ENTER:
          this.selectItem(mentionList[panelIdx]);
          break;
        default:
          this.setState({
            mentionList: []
          });
          break;
      }
    }
  };

  BaseMention.prototype.runMatcher = function runMatcher(str) {
    var _this2 = this;

    if (this.__matchTimer) {
      clearTimeout(this.__matchTimer);
    }
    this.__matchTimer = setTimeout(function () {
      _this2._matcher(str);
    }, this.props.delay);
  };

  BaseMention.prototype._matcher = function _matcher(str) {
    var _props = this.props,
        source = _props.source,
        matchRange = _props.matchRange;

    this.setState({
      panelVisible: false,
      mentionList: []
    });
    if (str.length >= matchRange[0] && str.length <= matchRange[1]) {
      if (Array.isArray(source)) {
        this.next(source.filter(function (item) {
          return item.indexOf(str) !== -1;
        }));
      } else {
        source(str, this.next.bind(this));
      }
    }
  };

  BaseMention.prototype.next = function next(matchResult) {
    var result = matchResult;
    if (this.props.formatter) {
      result = this.props.formatter(result);
    }
    this.setState({
      mentionList: result
    });
  };

  return BaseMention;
}(_react.Component);

exports["default"] = BaseMention;
;
module.exports = exports['default'];