react-mentions 4.4.2 → 4.4.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +25 -0
- package/README.md +7 -19
- package/dist/react-mentions.cjs.dev.js +132 -124
- package/dist/react-mentions.cjs.prod.js +138 -67
- package/dist/react-mentions.esm.js +132 -124
- package/package.json +7 -6
| @@ -8,7 +8,7 @@ Object.defineProperty(exports, "__esModule", { | |
| 8 8 | 
             
              value: !0
         | 
| 9 9 | 
             
            });
         | 
| 10 10 |  | 
| 11 | 
            -
            var _toConsumableArray = _interopDefault(require("@babel/runtime/helpers/toConsumableArray")), _extends = _interopDefault(require("@babel/runtime/helpers/extends")), _classCallCheck = _interopDefault(require("@babel/runtime/helpers/classCallCheck")), _createClass = _interopDefault(require("@babel/runtime/helpers/createClass")),  | 
| 11 | 
            +
            var _toConsumableArray = _interopDefault(require("@babel/runtime/helpers/toConsumableArray")), _extends = _interopDefault(require("@babel/runtime/helpers/extends")), _classCallCheck = _interopDefault(require("@babel/runtime/helpers/classCallCheck")), _createClass = _interopDefault(require("@babel/runtime/helpers/createClass")), _assertThisInitialized = _interopDefault(require("@babel/runtime/helpers/assertThisInitialized")), _inherits = _interopDefault(require("@babel/runtime/helpers/inherits")), _possibleConstructorReturn = _interopDefault(require("@babel/runtime/helpers/possibleConstructorReturn")), _getPrototypeOf = _interopDefault(require("@babel/runtime/helpers/getPrototypeOf")), _defineProperty = _interopDefault(require("@babel/runtime/helpers/defineProperty")), React = require("react"), React__default = _interopDefault(React), invariant = _interopDefault(require("invariant")), _slicedToArray = _interopDefault(require("@babel/runtime/helpers/slicedToArray")), _objectWithoutProperties = _interopDefault(require("@babel/runtime/helpers/objectWithoutProperties")), useStyles = require("substyle"), useStyles__default = _interopDefault(useStyles), PropTypes = _interopDefault(require("prop-types")), ReactDOM = _interopDefault(require("react-dom")), escapeRegex = function(str) {
         | 
| 12 12 | 
             
              return str.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
         | 
| 13 13 | 
             
            }, PLACEHOLDERS = {
         | 
| 14 14 | 
             
              id: "__id__",
         | 
| @@ -418,12 +418,12 @@ var _toConsumableArray = _interopDefault(require("@babel/runtime/helpers/toConsu | |
| 418 418 | 
             
                return obj.hasOwnProperty(k) && !keys.includes(k) && void 0 !== obj[k] && (acc[k] = obj[k]), 
         | 
| 419 419 | 
             
                acc;
         | 
| 420 420 | 
             
              }, {});
         | 
| 421 | 
            -
            };
         | 
| 421 | 
            +
            }, _excluded = [ "style", "className", "classNames" ];
         | 
| 422 422 |  | 
| 423 423 | 
             
            function createDefaultStyle(defaultStyle, getModifiers) {
         | 
| 424 424 | 
             
              return function(ComponentToWrap) {
         | 
| 425 425 | 
             
                var DefaultStyleEnhancer = function(_ref) {
         | 
| 426 | 
            -
                  var style = _ref.style, className = _ref.className, classNames = _ref.classNames, rest = _objectWithoutProperties(_ref,  | 
| 426 | 
            +
                  var style = _ref.style, className = _ref.className, classNames = _ref.classNames, rest = _objectWithoutProperties(_ref, _excluded), modifiers = getModifiers ? getModifiers(rest) : void 0, styles = useStyles__default(defaultStyle, {
         | 
| 427 427 | 
             
                    style: style,
         | 
| 428 428 | 
             
                    className: className,
         | 
| 429 429 | 
             
                    classNames: classNames
         | 
| @@ -437,12 +437,38 @@ function createDefaultStyle(defaultStyle, getModifiers) { | |
| 437 437 | 
             
              };
         | 
| 438 438 | 
             
            }
         | 
| 439 439 |  | 
| 440 | 
            +
            function _createSuper(Derived) {
         | 
| 441 | 
            +
              var hasNativeReflectConstruct = _isNativeReflectConstruct();
         | 
| 442 | 
            +
              return function() {
         | 
| 443 | 
            +
                var result, Super = _getPrototypeOf(Derived);
         | 
| 444 | 
            +
                if (hasNativeReflectConstruct) {
         | 
| 445 | 
            +
                  var NewTarget = _getPrototypeOf(this).constructor;
         | 
| 446 | 
            +
                  result = Reflect.construct(Super, arguments, NewTarget);
         | 
| 447 | 
            +
                } else result = Super.apply(this, arguments);
         | 
| 448 | 
            +
                return _possibleConstructorReturn(this, result);
         | 
| 449 | 
            +
              };
         | 
| 450 | 
            +
            }
         | 
| 451 | 
            +
             | 
| 452 | 
            +
            function _isNativeReflectConstruct() {
         | 
| 453 | 
            +
              if ("undefined" == typeof Reflect || !Reflect.construct) return !1;
         | 
| 454 | 
            +
              if (Reflect.construct.sham) return !1;
         | 
| 455 | 
            +
              if ("function" == typeof Proxy) return !0;
         | 
| 456 | 
            +
              try {
         | 
| 457 | 
            +
                return Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {})), 
         | 
| 458 | 
            +
                !0;
         | 
| 459 | 
            +
              } catch (e) {
         | 
| 460 | 
            +
                return !1;
         | 
| 461 | 
            +
              }
         | 
| 462 | 
            +
            }
         | 
| 463 | 
            +
             | 
| 440 464 | 
             
            var _generateComponentKey = function(usedKeys, id) {
         | 
| 441 465 | 
             
              return usedKeys.hasOwnProperty(id) ? usedKeys[id]++ : usedKeys[id] = 0, id + "_" + usedKeys[id];
         | 
| 442 466 | 
             
            }, Highlighter = function(_Component) {
         | 
| 467 | 
            +
              _inherits(Highlighter, _Component);
         | 
| 468 | 
            +
              var _super = _createSuper(Highlighter);
         | 
| 443 469 | 
             
              function Highlighter() {
         | 
| 444 470 | 
             
                var _this;
         | 
| 445 | 
            -
                return _classCallCheck(this, Highlighter), _this =  | 
| 471 | 
            +
                return _classCallCheck(this, Highlighter), _this = _super.apply(this, arguments), 
         | 
| 446 472 | 
             
                _defineProperty(_assertThisInitialized(_this), "setCaretElement", function(el) {
         | 
| 447 473 | 
             
                  _this.caretElement = el;
         | 
| 448 474 | 
             
                }), _this.state = {
         | 
| @@ -450,7 +476,7 @@ var _generateComponentKey = function(usedKeys, id) { | |
| 450 476 | 
             
                  top: void 0
         | 
| 451 477 | 
             
                }, _this;
         | 
| 452 478 | 
             
              }
         | 
| 453 | 
            -
              return  | 
| 479 | 
            +
              return _createClass(Highlighter, [ {
         | 
| 454 480 | 
             
                key: "componentDidMount",
         | 
| 455 481 | 
             
                value: function() {
         | 
| 456 482 | 
             
                  this.notifyCaretPosition();
         | 
| @@ -557,44 +583,30 @@ var styled = createDefaultStyle({ | |
| 557 583 | 
             
              return {
         | 
| 558 584 | 
             
                "&singleLine": props.singleLine
         | 
| 559 585 | 
             
              };
         | 
| 560 | 
            -
            }), Highlighter$1 = styled(Highlighter) | 
| 561 | 
            -
             | 
| 562 | 
            -
             | 
| 563 | 
            -
               | 
| 564 | 
            -
               | 
| 565 | 
            -
                 | 
| 566 | 
            -
                 | 
| 567 | 
            -
             | 
| 568 | 
            -
             | 
| 569 | 
            -
             | 
| 570 | 
            -
             | 
| 571 | 
            -
             | 
| 572 | 
            -
             | 
| 573 | 
            -
                 | 
| 574 | 
            -
              } | 
| 575 | 
            -
             | 
| 576 | 
            -
                 | 
| 577 | 
            -
             | 
| 578 | 
            -
             | 
| 579 | 
            -
             | 
| 580 | 
            -
               | 
| 581 | 
            -
             | 
| 582 | 
            -
                value: function() {
         | 
| 583 | 
            -
                  var suggestion = this.props.suggestion;
         | 
| 584 | 
            -
                  if ("string" == typeof suggestion) return suggestion;
         | 
| 585 | 
            -
                  var id = suggestion.id, display = suggestion.display;
         | 
| 586 | 
            -
                  return void 0 !== id && display ? display : id;
         | 
| 587 | 
            -
                }
         | 
| 588 | 
            -
              }, {
         | 
| 589 | 
            -
                key: "renderHighlightedDisplay",
         | 
| 590 | 
            -
                value: function(display) {
         | 
| 591 | 
            -
                  var _this$props2 = this.props, ignoreAccents = _this$props2.ignoreAccents, query = _this$props2.query, style = _this$props2.style, i = getSubstringIndex(display, query, ignoreAccents);
         | 
| 592 | 
            -
                  return -1 === i ? React__default.createElement("span", style("display"), display) : React__default.createElement("span", style("display"), display.substring(0, i), React__default.createElement("b", style("highlight"), display.substring(i, i + query.length)), display.substring(i + query.length));
         | 
| 593 | 
            -
                }
         | 
| 594 | 
            -
              } ]), Suggestion;
         | 
| 595 | 
            -
            }(React.Component);
         | 
| 586 | 
            +
            }), Highlighter$1 = styled(Highlighter);
         | 
| 587 | 
            +
             | 
| 588 | 
            +
            function Suggestion(_ref) {
         | 
| 589 | 
            +
              var display, highlightedDisplay, id = _ref.id, focused = _ref.focused, ignoreAccents = _ref.ignoreAccents, index = _ref.index, onClick = _ref.onClick, onMouseEnter = _ref.onMouseEnter, query = _ref.query, renderSuggestion = _ref.renderSuggestion, suggestion = _ref.suggestion, style = _ref.style, rest = (_ref.className, 
         | 
| 590 | 
            +
              _ref.classNames, {
         | 
| 591 | 
            +
                onClick: onClick,
         | 
| 592 | 
            +
                onMouseEnter: onMouseEnter
         | 
| 593 | 
            +
              }), getDisplay = function() {
         | 
| 594 | 
            +
                if ("string" == typeof suggestion) return suggestion;
         | 
| 595 | 
            +
                var id = suggestion.id, display = suggestion.display;
         | 
| 596 | 
            +
                return void 0 !== id && display ? display : id;
         | 
| 597 | 
            +
              }, renderHighlightedDisplay = function(display) {
         | 
| 598 | 
            +
                var i = getSubstringIndex(display, query, ignoreAccents);
         | 
| 599 | 
            +
                return -1 === i ? React__default.createElement("span", style("display"), display) : React__default.createElement("span", style("display"), display.substring(0, i), React__default.createElement("b", style("highlight"), display.substring(i, i + query.length)), display.substring(i + query.length));
         | 
| 600 | 
            +
              };
         | 
| 601 | 
            +
              return React__default.createElement("li", _extends({
         | 
| 602 | 
            +
                id: id,
         | 
| 603 | 
            +
                role: "option",
         | 
| 604 | 
            +
                "aria-selected": focused
         | 
| 605 | 
            +
              }, rest, style), (display = getDisplay(), highlightedDisplay = renderHighlightedDisplay(display), 
         | 
| 606 | 
            +
              renderSuggestion ? renderSuggestion(suggestion, query, highlightedDisplay, index, focused) : highlightedDisplay));
         | 
| 607 | 
            +
            }
         | 
| 596 608 |  | 
| 597 | 
            -
             | 
| 609 | 
            +
            Suggestion.propTypes = {
         | 
| 598 610 | 
             
              id: PropTypes.string.isRequired,
         | 
| 599 611 | 
             
              query: PropTypes.string.isRequired,
         | 
| 600 612 | 
             
              index: PropTypes.number.isRequired,
         | 
| @@ -605,7 +617,7 @@ _defineProperty(Suggestion, "propTypes", { | |
| 605 617 | 
             
              }) ]).isRequired,
         | 
| 606 618 | 
             
              renderSuggestion: PropTypes.func,
         | 
| 607 619 | 
             
              focused: PropTypes.bool
         | 
| 608 | 
            -
            } | 
| 620 | 
            +
            };
         | 
| 609 621 |  | 
| 610 622 | 
             
            var styled$1 = createDefaultStyle({
         | 
| 611 623 | 
             
              cursor: "pointer"
         | 
| @@ -615,18 +627,49 @@ var styled$1 = createDefaultStyle({ | |
| 615 627 | 
             
              };
         | 
| 616 628 | 
             
            }), Suggestion$1 = styled$1(Suggestion);
         | 
| 617 629 |  | 
| 618 | 
            -
            function LoadingIndicator() {
         | 
| 619 | 
            -
              var  | 
| 630 | 
            +
            function LoadingIndicator(_ref) {
         | 
| 631 | 
            +
              var style = _ref.style, className = _ref.className, classNames = _ref.classNames, styles = useStyles__default(defaultstyle, {
         | 
| 632 | 
            +
                style: style,
         | 
| 633 | 
            +
                className: className,
         | 
| 634 | 
            +
                classNames: classNames
         | 
| 635 | 
            +
              }), spinnerStyles = styles("spinner");
         | 
| 620 636 | 
             
              return React__default.createElement("div", styles, React__default.createElement("div", spinnerStyles, React__default.createElement("div", spinnerStyles([ "element", "element1" ])), React__default.createElement("div", spinnerStyles([ "element", "element2" ])), React__default.createElement("div", spinnerStyles([ "element", "element3" ])), React__default.createElement("div", spinnerStyles([ "element", "element4" ])), React__default.createElement("div", spinnerStyles([ "element", "element5" ]))));
         | 
| 621 637 | 
             
            }
         | 
| 622 638 |  | 
| 639 | 
            +
            var defaultstyle = {};
         | 
| 640 | 
            +
             | 
| 641 | 
            +
            function _createSuper$1(Derived) {
         | 
| 642 | 
            +
              var hasNativeReflectConstruct = _isNativeReflectConstruct$1();
         | 
| 643 | 
            +
              return function() {
         | 
| 644 | 
            +
                var result, Super = _getPrototypeOf(Derived);
         | 
| 645 | 
            +
                if (hasNativeReflectConstruct) {
         | 
| 646 | 
            +
                  var NewTarget = _getPrototypeOf(this).constructor;
         | 
| 647 | 
            +
                  result = Reflect.construct(Super, arguments, NewTarget);
         | 
| 648 | 
            +
                } else result = Super.apply(this, arguments);
         | 
| 649 | 
            +
                return _possibleConstructorReturn(this, result);
         | 
| 650 | 
            +
              };
         | 
| 651 | 
            +
            }
         | 
| 652 | 
            +
             | 
| 653 | 
            +
            function _isNativeReflectConstruct$1() {
         | 
| 654 | 
            +
              if ("undefined" == typeof Reflect || !Reflect.construct) return !1;
         | 
| 655 | 
            +
              if (Reflect.construct.sham) return !1;
         | 
| 656 | 
            +
              if ("function" == typeof Proxy) return !0;
         | 
| 657 | 
            +
              try {
         | 
| 658 | 
            +
                return Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {})), 
         | 
| 659 | 
            +
                !0;
         | 
| 660 | 
            +
              } catch (e) {
         | 
| 661 | 
            +
                return !1;
         | 
| 662 | 
            +
              }
         | 
| 663 | 
            +
            }
         | 
| 664 | 
            +
             | 
| 623 665 | 
             
            var SuggestionsOverlay = function(_Component) {
         | 
| 666 | 
            +
              _inherits(SuggestionsOverlay, _Component);
         | 
| 667 | 
            +
              var _super = _createSuper$1(SuggestionsOverlay);
         | 
| 624 668 | 
             
              function SuggestionsOverlay() {
         | 
| 625 | 
            -
                var  | 
| 669 | 
            +
                var _this;
         | 
| 626 670 | 
             
                _classCallCheck(this, SuggestionsOverlay);
         | 
| 627 671 | 
             
                for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) args[_key] = arguments[_key];
         | 
| 628 | 
            -
                return _this =  | 
| 629 | 
            -
                _defineProperty(_assertThisInitialized(_this), "handleMouseEnter", function(index, ev) {
         | 
| 672 | 
            +
                return _this = _super.call.apply(_super, [ this ].concat(args)), _defineProperty(_assertThisInitialized(_this), "handleMouseEnter", function(index, ev) {
         | 
| 630 673 | 
             
                  _this.props.onMouseEnter && _this.props.onMouseEnter(index);
         | 
| 631 674 | 
             
                }), _defineProperty(_assertThisInitialized(_this), "select", function(suggestion, queryInfo) {
         | 
| 632 675 | 
             
                  _this.props.onSelect(suggestion, queryInfo);
         | 
| @@ -634,7 +677,7 @@ var SuggestionsOverlay = function(_Component) { | |
| 634 677 | 
             
                  _this.ulElement = el;
         | 
| 635 678 | 
             
                }), _this;
         | 
| 636 679 | 
             
              }
         | 
| 637 | 
            -
              return  | 
| 680 | 
            +
              return _createClass(SuggestionsOverlay, [ {
         | 
| 638 681 | 
             
                key: "componentDidUpdate",
         | 
| 639 682 | 
             
                value: function() {
         | 
| 640 683 | 
             
                  if (this.ulElement && !(this.ulElement.offsetHeight >= this.ulElement.scrollHeight) && this.props.scrollFocusedIntoView) {
         | 
| @@ -664,13 +707,13 @@ var SuggestionsOverlay = function(_Component) { | |
| 664 707 | 
             
              }, {
         | 
| 665 708 | 
             
                key: "renderSuggestions",
         | 
| 666 709 | 
             
                value: function() {
         | 
| 667 | 
            -
                  var _this2 = this | 
| 668 | 
            -
                  return Object.values(this.props.suggestions).reduce(function(accResults, _ref) {
         | 
| 710 | 
            +
                  var _this2 = this, customSuggestionsContainer = this.props.customSuggestionsContainer, suggestions = Object.values(this.props.suggestions).reduce(function(accResults, _ref) {
         | 
| 669 711 | 
             
                    var results = _ref.results, queryInfo = _ref.queryInfo;
         | 
| 670 712 | 
             
                    return [].concat(_toConsumableArray(accResults), _toConsumableArray(results.map(function(result, index) {
         | 
| 671 713 | 
             
                      return _this2.renderSuggestion(result, queryInfo, accResults.length + index);
         | 
| 672 714 | 
             
                    })));
         | 
| 673 715 | 
             
                  }, []);
         | 
| 716 | 
            +
                  return customSuggestionsContainer ? customSuggestionsContainer(suggestions) : suggestions;
         | 
| 674 717 | 
             
                }
         | 
| 675 718 | 
             
              }, {
         | 
| 676 719 | 
             
                key: "renderSuggestion",
         | 
| @@ -757,15 +800,39 @@ function ownKeys(object, enumerableOnly) { | |
| 757 800 | 
             
            function _objectSpread(target) {
         | 
| 758 801 | 
             
              for (var i = 1; i < arguments.length; i++) {
         | 
| 759 802 | 
             
                var source = null != arguments[i] ? arguments[i] : {};
         | 
| 760 | 
            -
                i % 2 ? ownKeys(source, !0).forEach(function(key) {
         | 
| 803 | 
            +
                i % 2 ? ownKeys(Object(source), !0).forEach(function(key) {
         | 
| 761 804 | 
             
                  _defineProperty(target, key, source[key]);
         | 
| 762 | 
            -
                }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(source).forEach(function(key) {
         | 
| 805 | 
            +
                }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
         | 
| 763 806 | 
             
                  Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
         | 
| 764 807 | 
             
                });
         | 
| 765 808 | 
             
              }
         | 
| 766 809 | 
             
              return target;
         | 
| 767 810 | 
             
            }
         | 
| 768 811 |  | 
| 812 | 
            +
            function _createSuper$2(Derived) {
         | 
| 813 | 
            +
              var hasNativeReflectConstruct = _isNativeReflectConstruct$2();
         | 
| 814 | 
            +
              return function() {
         | 
| 815 | 
            +
                var result, Super = _getPrototypeOf(Derived);
         | 
| 816 | 
            +
                if (hasNativeReflectConstruct) {
         | 
| 817 | 
            +
                  var NewTarget = _getPrototypeOf(this).constructor;
         | 
| 818 | 
            +
                  result = Reflect.construct(Super, arguments, NewTarget);
         | 
| 819 | 
            +
                } else result = Super.apply(this, arguments);
         | 
| 820 | 
            +
                return _possibleConstructorReturn(this, result);
         | 
| 821 | 
            +
              };
         | 
| 822 | 
            +
            }
         | 
| 823 | 
            +
             | 
| 824 | 
            +
            function _isNativeReflectConstruct$2() {
         | 
| 825 | 
            +
              if ("undefined" == typeof Reflect || !Reflect.construct) return !1;
         | 
| 826 | 
            +
              if (Reflect.construct.sham) return !1;
         | 
| 827 | 
            +
              if ("function" == typeof Proxy) return !0;
         | 
| 828 | 
            +
              try {
         | 
| 829 | 
            +
                return Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {})), 
         | 
| 830 | 
            +
                !0;
         | 
| 831 | 
            +
              } catch (e) {
         | 
| 832 | 
            +
                return !1;
         | 
| 833 | 
            +
              }
         | 
| 834 | 
            +
            }
         | 
| 835 | 
            +
             | 
| 769 836 | 
             
            var makeTriggerRegex = function(trigger) {
         | 
| 770 837 | 
             
              var options = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : {};
         | 
| 771 838 | 
             
              if (trigger instanceof RegExp) return trigger;
         | 
| @@ -794,6 +861,7 @@ var makeTriggerRegex = function(trigger) { | |
| 794 861 | 
             
              a11ySuggestionsListLabel: PropTypes.string,
         | 
| 795 862 | 
             
              value: PropTypes.string,
         | 
| 796 863 | 
             
              onKeyDown: PropTypes.func,
         | 
| 864 | 
            +
              customSuggestionsContainer: PropTypes.func,
         | 
| 797 865 | 
             
              onSelect: PropTypes.func,
         | 
| 798 866 | 
             
              onBlur: PropTypes.func,
         | 
| 799 867 | 
             
              onChange: PropTypes.func,
         | 
| @@ -803,24 +871,26 @@ var makeTriggerRegex = function(trigger) { | |
| 803 871 | 
             
              }) ]),
         | 
| 804 872 | 
             
              children: PropTypes.oneOfType([ PropTypes.element, PropTypes.arrayOf(PropTypes.element) ]).isRequired
         | 
| 805 873 | 
             
            }, MentionsInput = function(_React$Component) {
         | 
| 874 | 
            +
              _inherits(MentionsInput, _React$Component);
         | 
| 875 | 
            +
              var _super = _createSuper$2(MentionsInput);
         | 
| 806 876 | 
             
              function MentionsInput(_props) {
         | 
| 807 877 | 
             
                var _this;
         | 
| 808 | 
            -
                return _classCallCheck(this, MentionsInput), _this =  | 
| 878 | 
            +
                return _classCallCheck(this, MentionsInput), _this = _super.call(this, _props), 
         | 
| 809 879 | 
             
                _defineProperty(_assertThisInitialized(_this), "setContainerElement", function(el) {
         | 
| 810 880 | 
             
                  _this.containerElement = el;
         | 
| 811 881 | 
             
                }), _defineProperty(_assertThisInitialized(_this), "getInputProps", function() {
         | 
| 812 882 | 
             
                  var _this$props = _this.props, readOnly = _this$props.readOnly, disabled = _this$props.disabled, style = _this$props.style;
         | 
| 813 | 
            -
                  return _objectSpread({}, omit(_this.props, [ "style", "classNames", "className" ], keys(propTypes)),  | 
| 814 | 
            -
                    value: _this.getPlainText()
         | 
| 883 | 
            +
                  return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, omit(_this.props, [ "style", "classNames", "className" ], keys(propTypes))), style("input")), {}, {
         | 
| 884 | 
            +
                    value: _this.getPlainText(),
         | 
| 885 | 
            +
                    onScroll: _this.updateHighlighterScroll
         | 
| 815 886 | 
             
                  }, !readOnly && !disabled && {
         | 
| 816 887 | 
             
                    onChange: _this.handleChange,
         | 
| 817 888 | 
             
                    onSelect: _this.handleSelect,
         | 
| 818 889 | 
             
                    onKeyDown: _this.handleKeyDown,
         | 
| 819 890 | 
             
                    onBlur: _this.handleBlur,
         | 
| 820 891 | 
             
                    onCompositionStart: _this.handleCompositionStart,
         | 
| 821 | 
            -
                    onCompositionEnd: _this.handleCompositionEnd | 
| 822 | 
            -
             | 
| 823 | 
            -
                  }, {}, _this.isOpened() && {
         | 
| 892 | 
            +
                    onCompositionEnd: _this.handleCompositionEnd
         | 
| 893 | 
            +
                  }), _this.isOpened() && {
         | 
| 824 894 | 
             
                    role: "combobox",
         | 
| 825 895 | 
             
                    "aria-controls": _this.uuidSuggestionsOverlay,
         | 
| 826 896 | 
             
                    "aria-expanded": !0,
         | 
| @@ -859,6 +929,7 @@ var makeTriggerRegex = function(trigger) { | |
| 859 929 | 
             
                    scrollFocusedIntoView: _this.state.scrollFocusedIntoView,
         | 
| 860 930 | 
             
                    containerRef: _this.setSuggestionsElement,
         | 
| 861 931 | 
             
                    suggestions: _this.state.suggestions,
         | 
| 932 | 
            +
                    customSuggestionsContainer: _this.props.customSuggestionsContainer,
         | 
| 862 933 | 
             
                    onSelect: _this.addMention,
         | 
| 863 934 | 
             
                    onMouseDown: _this.handleSuggestionsMouseDown,
         | 
| 864 935 | 
             
                    onMouseEnter: _this.handleSuggestionsMouseEnter,
         | 
| @@ -900,7 +971,7 @@ var makeTriggerRegex = function(trigger) { | |
| 900 971 | 
             
                  }, config);
         | 
| 901 972 | 
             
                  newPlainTextValue = getPlainText(newValue, config);
         | 
| 902 973 | 
             
                  var selectionStart = ev.target.selectionStart, selectionEnd = ev.target.selectionEnd, setSelectionAfterMentionChange = !1, startOfMention = findStartOfMentionInPlainText(value, config, selectionStart);
         | 
| 903 | 
            -
                  void 0 !== startOfMention && _this.state.selectionEnd > startOfMention && (selectionEnd = selectionStart = startOfMention, 
         | 
| 974 | 
            +
                  void 0 !== startOfMention && _this.state.selectionEnd > startOfMention && (selectionEnd = selectionStart = startOfMention + (ev.nativeEvent.data ? ev.nativeEvent.data.length : 0), 
         | 
| 904 975 | 
             
                  setSelectionAfterMentionChange = !0), _this.setState({
         | 
| 905 976 | 
             
                    selectionStart: selectionStart,
         | 
| 906 977 | 
             
                    selectionEnd: selectionEnd,
         | 
| @@ -994,7 +1065,7 @@ var makeTriggerRegex = function(trigger) { | |
| 994 1065 | 
             
                      } else {
         | 
| 995 1066 | 
             
                        var _left = caretPosition.left - highlighter.scrollLeft, _top = caretPosition.top - highlighter.scrollTop;
         | 
| 996 1067 | 
             
                        _left + suggestions.offsetWidth > _this.containerElement.offsetWidth ? position.right = 0 : position.left = _left, 
         | 
| 997 | 
            -
                        allowSuggestionsAboveCursor && viewportRelative.top - highlighter.scrollTop + suggestions.offsetHeight > viewportHeight && suggestions.offsetHeight < caretOffsetParentRect.top - caretHeight - highlighter.scrollTop ? position.top = _top - suggestions.offsetHeight - caretHeight : position.top = _top;
         | 
| 1068 | 
            +
                        allowSuggestionsAboveCursor && viewportRelative.top - highlighter.scrollTop + suggestions.offsetHeight > viewportHeight && suggestions.offsetHeight < caretOffsetParentRect.top - caretHeight - highlighter.scrollTop || forceSuggestionsAboveCursor ? position.top = _top - suggestions.offsetHeight - caretHeight : position.top = _top;
         | 
| 998 1069 | 
             
                      }
         | 
| 999 1070 | 
             
                      position.left === _this.state.suggestionsPosition.left && position.top === _this.state.suggestionsPosition.top && position.position === _this.state.suggestionsPosition.position || _this.setState({
         | 
| 1000 1071 | 
             
                        suggestionsPosition: position
         | 
| @@ -1045,7 +1116,7 @@ var makeTriggerRegex = function(trigger) { | |
| 1045 1116 | 
             
                  syncResult instanceof Array && _this.updateSuggestions(_this._queryId, childIndex, query, querySequenceStart, querySequenceEnd, plainTextValue, syncResult);
         | 
| 1046 1117 | 
             
                }), _defineProperty(_assertThisInitialized(_this), "updateSuggestions", function(queryId, childIndex, query, querySequenceStart, querySequenceEnd, plainTextValue, results) {
         | 
| 1047 1118 | 
             
                  if (queryId === _this._queryId) {
         | 
| 1048 | 
            -
                    _this.suggestions = _objectSpread({}, _this.suggestions, _defineProperty({}, childIndex, {
         | 
| 1119 | 
            +
                    _this.suggestions = _objectSpread(_objectSpread({}, _this.suggestions), {}, _defineProperty({}, childIndex, {
         | 
| 1049 1120 | 
             
                      queryInfo: {
         | 
| 1050 1121 | 
             
                        childIndex: childIndex,
         | 
| 1051 1122 | 
             
                        query: query,
         | 
| @@ -1100,7 +1171,7 @@ var makeTriggerRegex = function(trigger) { | |
| 1100 1171 | 
             
                  suggestionsPosition: {}
         | 
| 1101 1172 | 
             
                }, _this;
         | 
| 1102 1173 | 
             
              }
         | 
| 1103 | 
            -
              return  | 
| 1174 | 
            +
              return _createClass(MentionsInput, [ {
         | 
| 1104 1175 | 
             
                key: "componentDidMount",
         | 
| 1105 1176 | 
             
                value: function() {
         | 
| 1106 1177 | 
             
                  document.addEventListener("copy", this.handleCopy), document.addEventListener("cut", this.handleCut), 
         | 
| @@ -1133,7 +1204,7 @@ var makeTriggerRegex = function(trigger) { | |
| 1133 1204 | 
             
                  if (event.target === this.inputElement && this.supportsClipboardActions(event)) {
         | 
| 1134 1205 | 
             
                    event.preventDefault();
         | 
| 1135 1206 | 
             
                    var _this$state3 = this.state, selectionStart = _this$state3.selectionStart, selectionEnd = _this$state3.selectionEnd, _this$props7 = this.props, value = _this$props7.value, children = _this$props7.children, config = readConfigFromChildren(children), markupStartIndex = mapPlainTextIndex(value, config, selectionStart, "START"), markupEndIndex = mapPlainTextIndex(value, config, selectionEnd, "END"), pastedMentions = event.clipboardData.getData("text/react-mentions"), pastedData = event.clipboardData.getData("text/plain"), newValue = spliceString(value, markupStartIndex, markupEndIndex, pastedMentions || pastedData).replace(/\r/g, ""), newPlainTextValue = getPlainText(newValue, config), eventMock = {
         | 
| 1136 | 
            -
                      target: _objectSpread({}, event.target, {
         | 
| 1207 | 
            +
                      target: _objectSpread(_objectSpread({}, event.target), {}, {
         | 
| 1137 1208 | 
             
                        value: newValue
         | 
| 1138 1209 | 
             
                      })
         | 
| 1139 1210 | 
             
                    };
         | 
| @@ -1145,7 +1216,7 @@ var makeTriggerRegex = function(trigger) { | |
| 1145 1216 | 
             
              }, {
         | 
| 1146 1217 | 
             
                key: "saveSelectionToClipboard",
         | 
| 1147 1218 | 
             
                value: function(event) {
         | 
| 1148 | 
            -
                  var  | 
| 1219 | 
            +
                  var selectionStart = this.inputElement.selectionStart, selectionEnd = this.inputElement.selectionEnd, _this$props8 = this.props, children = _this$props8.children, value = _this$props8.value, config = readConfigFromChildren(children), markupStartIndex = mapPlainTextIndex(value, config, selectionStart, "START"), markupEndIndex = mapPlainTextIndex(value, config, selectionEnd, "END");
         | 
| 1149 1220 | 
             
                  event.clipboardData.setData("text/plain", event.target.value.slice(selectionStart, selectionEnd)), 
         | 
| 1150 1221 | 
             
                  event.clipboardData.setData("text/react-mentions", value.slice(markupStartIndex, markupEndIndex));
         | 
| 1151 1222 | 
             
                }
         | 
| @@ -1165,8 +1236,8 @@ var makeTriggerRegex = function(trigger) { | |
| 1165 1236 | 
             
                value: function(event) {
         | 
| 1166 1237 | 
             
                  if (event.target === this.inputElement && this.supportsClipboardActions(event)) {
         | 
| 1167 1238 | 
             
                    event.preventDefault(), this.saveSelectionToClipboard(event);
         | 
| 1168 | 
            -
                    var _this$ | 
| 1169 | 
            -
                      target: _objectSpread({}, event.target, {
         | 
| 1239 | 
            +
                    var _this$state4 = this.state, selectionStart = _this$state4.selectionStart, selectionEnd = _this$state4.selectionEnd, _this$props9 = this.props, children = _this$props9.children, value = _this$props9.value, config = readConfigFromChildren(children), markupStartIndex = mapPlainTextIndex(value, config, selectionStart, "START"), markupEndIndex = mapPlainTextIndex(value, config, selectionEnd, "END"), newValue = [ value.slice(0, markupStartIndex), value.slice(markupEndIndex) ].join(""), newPlainTextValue = getPlainText(newValue, config), eventMock = {
         | 
| 1240 | 
            +
                      target: _objectSpread(_objectSpread({}, event.target), {}, {
         | 
| 1170 1241 | 
             
                        value: newPlainTextValue
         | 
| 1171 1242 | 
             
                      })
         | 
| 1172 1243 | 
             
                    };
         |