react-mentions 4.4.2 → 4.4.4

package/dist/react-mentions.cjs.prod.js

@@ -8,7 +8,7 @@ Object.defineProperty(exports, "__esModule", {
   value: !0
 });
 
-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")), _possibleConstructorReturn = _interopDefault(require("@babel/runtime/helpers/possibleConstructorReturn")), _getPrototypeOf = _interopDefault(require("@babel/runtime/helpers/getPrototypeOf")), _assertThisInitialized = _interopDefault(require("@babel/runtime/helpers/assertThisInitialized")), _inherits = _interopDefault(require("@babel/runtime/helpers/inherits")), _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) {
+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) {
   return str.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
 }, PLACEHOLDERS = {
   id: "__id__",
@@ -418,12 +418,12 @@ var _toConsumableArray = _interopDefault(require("@babel/runtime/helpers/toConsu
     return obj.hasOwnProperty(k) && !keys.includes(k) && void 0 !== obj[k] && (acc[k] = obj[k]), 
     acc;
   }, {});
-};
+}, _excluded = [ "style", "className", "classNames" ];
 
 function createDefaultStyle(defaultStyle, getModifiers) {
   return function(ComponentToWrap) {
     var DefaultStyleEnhancer = function(_ref) {
-      var style = _ref.style, className = _ref.className, classNames = _ref.classNames, rest = _objectWithoutProperties(_ref, [ "style", "className", "classNames" ]), modifiers = getModifiers ? getModifiers(rest) : void 0, styles = useStyles__default(defaultStyle, {
+      var style = _ref.style, className = _ref.className, classNames = _ref.classNames, rest = _objectWithoutProperties(_ref, _excluded), modifiers = getModifiers ? getModifiers(rest) : void 0, styles = useStyles__default(defaultStyle, {
         style: style,
         className: className,
         classNames: classNames
@@ -437,12 +437,38 @@ function createDefaultStyle(defaultStyle, getModifiers) {
   };
 }
 
+function _createSuper(Derived) {
+  var hasNativeReflectConstruct = _isNativeReflectConstruct();
+  return function() {
+    var result, Super = _getPrototypeOf(Derived);
+    if (hasNativeReflectConstruct) {
+      var NewTarget = _getPrototypeOf(this).constructor;
+      result = Reflect.construct(Super, arguments, NewTarget);
+    } else result = Super.apply(this, arguments);
+    return _possibleConstructorReturn(this, result);
+  };
+}
+
+function _isNativeReflectConstruct() {
+  if ("undefined" == typeof Reflect || !Reflect.construct) return !1;
+  if (Reflect.construct.sham) return !1;
+  if ("function" == typeof Proxy) return !0;
+  try {
+    return Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {})), 
+    !0;
+  } catch (e) {
+    return !1;
+  }
+}
+
 var _generateComponentKey = function(usedKeys, id) {
   return usedKeys.hasOwnProperty(id) ? usedKeys[id]++ : usedKeys[id] = 0, id + "_" + usedKeys[id];
 }, Highlighter = function(_Component) {
+  _inherits(Highlighter, _Component);
+  var _super = _createSuper(Highlighter);
   function Highlighter() {
     var _this;
-    return _classCallCheck(this, Highlighter), _this = _possibleConstructorReturn(this, _getPrototypeOf(Highlighter).apply(this, arguments)), 
+    return _classCallCheck(this, Highlighter), _this = _super.apply(this, arguments), 
     _defineProperty(_assertThisInitialized(_this), "setCaretElement", function(el) {
       _this.caretElement = el;
     }), _this.state = {
@@ -450,7 +476,7 @@ var _generateComponentKey = function(usedKeys, id) {
       top: void 0
     }, _this;
   }
-  return _inherits(Highlighter, _Component), _createClass(Highlighter, [ {
+  return _createClass(Highlighter, [ {
     key: "componentDidMount",
     value: function() {
       this.notifyCaretPosition();
@@ -557,11 +583,39 @@ var styled = createDefaultStyle({
   return {
     "&singleLine": props.singleLine
   };
-}), Highlighter$1 = styled(Highlighter), Suggestion = function(_Component) {
+}), Highlighter$1 = styled(Highlighter);
+
+function _createSuper$1(Derived) {
+  var hasNativeReflectConstruct = _isNativeReflectConstruct$1();
+  return function() {
+    var result, Super = _getPrototypeOf(Derived);
+    if (hasNativeReflectConstruct) {
+      var NewTarget = _getPrototypeOf(this).constructor;
+      result = Reflect.construct(Super, arguments, NewTarget);
+    } else result = Super.apply(this, arguments);
+    return _possibleConstructorReturn(this, result);
+  };
+}
+
+function _isNativeReflectConstruct$1() {
+  if ("undefined" == typeof Reflect || !Reflect.construct) return !1;
+  if (Reflect.construct.sham) return !1;
+  if ("function" == typeof Proxy) return !0;
+  try {
+    return Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {})), 
+    !0;
+  } catch (e) {
+    return !1;
+  }
+}
+
+var Suggestion = function(_Component) {
+  _inherits(Suggestion, _Component);
+  var _super = _createSuper$1(Suggestion);
   function Suggestion() {
-    return _classCallCheck(this, Suggestion), _possibleConstructorReturn(this, _getPrototypeOf(Suggestion).apply(this, arguments));
+    return _classCallCheck(this, Suggestion), _super.apply(this, arguments);
   }
-  return _inherits(Suggestion, _Component), _createClass(Suggestion, [ {
+  return _createClass(Suggestion, [ {
     key: "render",
     value: function() {
       var rest = omit(this.props, [ "style", "classNames", "className" ], keys(Suggestion.propTypes));
@@ -615,18 +669,49 @@ var styled$1 = createDefaultStyle({
   };
 }), Suggestion$1 = styled$1(Suggestion);
 
-function LoadingIndicator() {
-  var styles = useStyles__default(), spinnerStyles = styles("spinner");
+function LoadingIndicator(_ref) {
+  var style = _ref.style, className = _ref.className, classNames = _ref.classNames, styles = useStyles__default(defaultstyle, {
+    style: style,
+    className: className,
+    classNames: classNames
+  }), spinnerStyles = styles("spinner");
   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" ]))));
 }
 
+var defaultstyle = {};
+
+function _createSuper$2(Derived) {
+  var hasNativeReflectConstruct = _isNativeReflectConstruct$2();
+  return function() {
+    var result, Super = _getPrototypeOf(Derived);
+    if (hasNativeReflectConstruct) {
+      var NewTarget = _getPrototypeOf(this).constructor;
+      result = Reflect.construct(Super, arguments, NewTarget);
+    } else result = Super.apply(this, arguments);
+    return _possibleConstructorReturn(this, result);
+  };
+}
+
+function _isNativeReflectConstruct$2() {
+  if ("undefined" == typeof Reflect || !Reflect.construct) return !1;
+  if (Reflect.construct.sham) return !1;
+  if ("function" == typeof Proxy) return !0;
+  try {
+    return Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {})), 
+    !0;
+  } catch (e) {
+    return !1;
+  }
+}
+
 var SuggestionsOverlay = function(_Component) {
+  _inherits(SuggestionsOverlay, _Component);
+  var _super = _createSuper$2(SuggestionsOverlay);
   function SuggestionsOverlay() {
-    var _getPrototypeOf2, _this;
+    var _this;
     _classCallCheck(this, SuggestionsOverlay);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) args[_key] = arguments[_key];
-    return _this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(SuggestionsOverlay)).call.apply(_getPrototypeOf2, [ this ].concat(args))), 
-    _defineProperty(_assertThisInitialized(_this), "handleMouseEnter", function(index, ev) {
+    return _this = _super.call.apply(_super, [ this ].concat(args)), _defineProperty(_assertThisInitialized(_this), "handleMouseEnter", function(index, ev) {
       _this.props.onMouseEnter && _this.props.onMouseEnter(index);
     }), _defineProperty(_assertThisInitialized(_this), "select", function(suggestion, queryInfo) {
       _this.props.onSelect(suggestion, queryInfo);
@@ -634,7 +719,7 @@ var SuggestionsOverlay = function(_Component) {
       _this.ulElement = el;
     }), _this;
   }
-  return _inherits(SuggestionsOverlay, _Component), _createClass(SuggestionsOverlay, [ {
+  return _createClass(SuggestionsOverlay, [ {
     key: "componentDidUpdate",
     value: function() {
       if (this.ulElement && !(this.ulElement.offsetHeight >= this.ulElement.scrollHeight) && this.props.scrollFocusedIntoView) {
@@ -664,13 +749,13 @@ var SuggestionsOverlay = function(_Component) {
   }, {
     key: "renderSuggestions",
     value: function() {
-      var _this2 = this;
-      return Object.values(this.props.suggestions).reduce(function(accResults, _ref) {
+      var _this2 = this, customSuggestionsContainer = this.props.customSuggestionsContainer, suggestions = Object.values(this.props.suggestions).reduce(function(accResults, _ref) {
         var results = _ref.results, queryInfo = _ref.queryInfo;
         return [].concat(_toConsumableArray(accResults), _toConsumableArray(results.map(function(result, index) {
           return _this2.renderSuggestion(result, queryInfo, accResults.length + index);
         })));
       }, []);
+      return customSuggestionsContainer ? customSuggestionsContainer(suggestions) : suggestions;
     }
   }, {
     key: "renderSuggestion",
@@ -757,15 +842,39 @@ function ownKeys(object, enumerableOnly) {
 function _objectSpread(target) {
   for (var i = 1; i < arguments.length; i++) {
     var source = null != arguments[i] ? arguments[i] : {};
-    i % 2 ? ownKeys(source, !0).forEach(function(key) {
+    i % 2 ? ownKeys(Object(source), !0).forEach(function(key) {
       _defineProperty(target, key, source[key]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(source).forEach(function(key) {
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
       Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
     });
   }
   return target;
 }
 
+function _createSuper$3(Derived) {
+  var hasNativeReflectConstruct = _isNativeReflectConstruct$3();
+  return function() {
+    var result, Super = _getPrototypeOf(Derived);
+    if (hasNativeReflectConstruct) {
+      var NewTarget = _getPrototypeOf(this).constructor;
+      result = Reflect.construct(Super, arguments, NewTarget);
+    } else result = Super.apply(this, arguments);
+    return _possibleConstructorReturn(this, result);
+  };
+}
+
+function _isNativeReflectConstruct$3() {
+  if ("undefined" == typeof Reflect || !Reflect.construct) return !1;
+  if (Reflect.construct.sham) return !1;
+  if ("function" == typeof Proxy) return !0;
+  try {
+    return Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {})), 
+    !0;
+  } catch (e) {
+    return !1;
+  }
+}
+
 var makeTriggerRegex = function(trigger) {
   var options = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : {};
   if (trigger instanceof RegExp) return trigger;
@@ -794,6 +903,7 @@ var makeTriggerRegex = function(trigger) {
   a11ySuggestionsListLabel: PropTypes.string,
   value: PropTypes.string,
   onKeyDown: PropTypes.func,
+  customSuggestionsContainer: PropTypes.func,
   onSelect: PropTypes.func,
   onBlur: PropTypes.func,
   onChange: PropTypes.func,
@@ -803,24 +913,26 @@ var makeTriggerRegex = function(trigger) {
   }) ]),
   children: PropTypes.oneOfType([ PropTypes.element, PropTypes.arrayOf(PropTypes.element) ]).isRequired
 }, MentionsInput = function(_React$Component) {
+  _inherits(MentionsInput, _React$Component);
+  var _super = _createSuper$3(MentionsInput);
   function MentionsInput(_props) {
     var _this;
-    return _classCallCheck(this, MentionsInput), _this = _possibleConstructorReturn(this, _getPrototypeOf(MentionsInput).call(this, _props)), 
+    return _classCallCheck(this, MentionsInput), _this = _super.call(this, _props), 
     _defineProperty(_assertThisInitialized(_this), "setContainerElement", function(el) {
       _this.containerElement = el;
     }), _defineProperty(_assertThisInitialized(_this), "getInputProps", function() {
       var _this$props = _this.props, readOnly = _this$props.readOnly, disabled = _this$props.disabled, style = _this$props.style;
-      return _objectSpread({}, omit(_this.props, [ "style", "classNames", "className" ], keys(propTypes)), {}, style("input"), {
-        value: _this.getPlainText()
+      return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, omit(_this.props, [ "style", "classNames", "className" ], keys(propTypes))), style("input")), {}, {
+        value: _this.getPlainText(),
+        onScroll: _this.updateHighlighterScroll
       }, !readOnly && !disabled && {
         onChange: _this.handleChange,
         onSelect: _this.handleSelect,
         onKeyDown: _this.handleKeyDown,
         onBlur: _this.handleBlur,
         onCompositionStart: _this.handleCompositionStart,
-        onCompositionEnd: _this.handleCompositionEnd,
-        onScroll: _this.updateHighlighterScroll
-      }, {}, _this.isOpened() && {
+        onCompositionEnd: _this.handleCompositionEnd
+      }), _this.isOpened() && {
         role: "combobox",
         "aria-controls": _this.uuidSuggestionsOverlay,
         "aria-expanded": !0,
@@ -859,6 +971,7 @@ var makeTriggerRegex = function(trigger) {
         scrollFocusedIntoView: _this.state.scrollFocusedIntoView,
         containerRef: _this.setSuggestionsElement,
         suggestions: _this.state.suggestions,
+        customSuggestionsContainer: _this.props.customSuggestionsContainer,
         onSelect: _this.addMention,
         onMouseDown: _this.handleSuggestionsMouseDown,
         onMouseEnter: _this.handleSuggestionsMouseEnter,
@@ -900,7 +1013,7 @@ var makeTriggerRegex = function(trigger) {
       }, config);
       newPlainTextValue = getPlainText(newValue, config);
       var selectionStart = ev.target.selectionStart, selectionEnd = ev.target.selectionEnd, setSelectionAfterMentionChange = !1, startOfMention = findStartOfMentionInPlainText(value, config, selectionStart);
-      void 0 !== startOfMention && _this.state.selectionEnd > startOfMention && (selectionEnd = selectionStart = startOfMention, 
+      void 0 !== startOfMention && _this.state.selectionEnd > startOfMention && (selectionEnd = selectionStart = startOfMention + (ev.nativeEvent.data ? ev.nativeEvent.data.length : 0), 
       setSelectionAfterMentionChange = !0), _this.setState({
         selectionStart: selectionStart,
         selectionEnd: selectionEnd,
@@ -1045,7 +1158,7 @@ var makeTriggerRegex = function(trigger) {
       syncResult instanceof Array && _this.updateSuggestions(_this._queryId, childIndex, query, querySequenceStart, querySequenceEnd, plainTextValue, syncResult);
     }), _defineProperty(_assertThisInitialized(_this), "updateSuggestions", function(queryId, childIndex, query, querySequenceStart, querySequenceEnd, plainTextValue, results) {
       if (queryId === _this._queryId) {
-        _this.suggestions = _objectSpread({}, _this.suggestions, _defineProperty({}, childIndex, {
+        _this.suggestions = _objectSpread(_objectSpread({}, _this.suggestions), {}, _defineProperty({}, childIndex, {
           queryInfo: {
             childIndex: childIndex,
             query: query,
@@ -1100,7 +1213,7 @@ var makeTriggerRegex = function(trigger) {
       suggestionsPosition: {}
     }, _this;
   }
-  return _inherits(MentionsInput, _React$Component), _createClass(MentionsInput, [ {
+  return _createClass(MentionsInput, [ {
     key: "componentDidMount",
     value: function() {
       document.addEventListener("copy", this.handleCopy), document.addEventListener("cut", this.handleCut), 
@@ -1133,7 +1246,7 @@ var makeTriggerRegex = function(trigger) {
       if (event.target === this.inputElement && this.supportsClipboardActions(event)) {
         event.preventDefault();
         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 = {
-          target: _objectSpread({}, event.target, {
+          target: _objectSpread(_objectSpread({}, event.target), {}, {
             value: newValue
           })
         };
@@ -1145,7 +1258,7 @@ var makeTriggerRegex = function(trigger) {
   }, {
     key: "saveSelectionToClipboard",
     value: function(event) {
-      var _this$state4 = this.state, selectionStart = _this$state4.selectionStart, selectionEnd = _this$state4.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");
+      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");
       event.clipboardData.setData("text/plain", event.target.value.slice(selectionStart, selectionEnd)), 
       event.clipboardData.setData("text/react-mentions", value.slice(markupStartIndex, markupEndIndex));
     }
@@ -1165,8 +1278,8 @@ var makeTriggerRegex = function(trigger) {
     value: function(event) {
       if (event.target === this.inputElement && this.supportsClipboardActions(event)) {
         event.preventDefault(), this.saveSelectionToClipboard(event);
-        var _this$state5 = this.state, selectionStart = _this$state5.selectionStart, selectionEnd = _this$state5.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 = {
-          target: _objectSpread({}, event.target, {
+        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 = {
+          target: _objectSpread(_objectSpread({}, event.target), {}, {
             value: newPlainTextValue
           })
         };