react-mentions 4.3.1 → 4.3.2
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/README.md
CHANGED
@@ -7,7 +7,7 @@
|
|
7
7
|
|
8
8
|
A React component that let's you mention people in a textarea like you are used to on Facebook or Twitter.
|
9
9
|
|
10
|
-
Used in production at [Signavio](https://signavio.com), [State](https://state.com), [Snips](https://snips.ai), [Swat.io](https://swat.io), [GotDone](https://www.gotdone.me), [Volinspire](https://volinspire.com), [Marvin](https://amazingmarvin.com), [Timely](https://timelyapp.com), [GuideFitter](https://www.guidefitter.com/), [Evite](https://www.evite.com/), [Publer](https://publer.me/), [Kontentino](https://www.kontentino.com/), [Wix.com](https://wix.com) and [you?](https://github.com/signavio/react-mentions/edit/master/README.md)
|
10
|
+
Used in production at [Signavio](https://signavio.com), [State](https://state.com), [Snips](https://snips.ai), [Swat.io](https://swat.io), [GotDone](https://www.gotdone.me), [Volinspire](https://volinspire.com), [Marvin](https://amazingmarvin.com), [Timely](https://timelyapp.com), [GuideFitter](https://www.guidefitter.com/), [Evite](https://www.evite.com/), [Publer](https://publer.me/), [Kontentino](https://www.kontentino.com/), [Wix.com](https://wix.com), [Highlight](https://highlight.run/) and [you?](https://github.com/signavio/react-mentions/edit/master/README.md)
|
11
11
|
|
12
12
|
## Getting started
|
13
13
|
|
@@ -1064,6 +1064,7 @@ function (_Component) {
|
|
1064
1064
|
containerRef = _this$props.containerRef,
|
1065
1065
|
position = _this$props.position,
|
1066
1066
|
left = _this$props.left,
|
1067
|
+
right = _this$props.right,
|
1067
1068
|
top = _this$props.top; // do not show suggestions until there is some data
|
1068
1069
|
|
1069
1070
|
if (!isOpened) {
|
@@ -1073,6 +1074,7 @@ function (_Component) {
|
|
1073
1074
|
return React__default.createElement("div", _extends({}, useStyles.inline({
|
1074
1075
|
position: position || 'absolute',
|
1075
1076
|
left: left,
|
1077
|
+
right: right,
|
1076
1078
|
top: top
|
1077
1079
|
}, style), {
|
1078
1080
|
onMouseDown: onMouseDown,
|
@@ -1148,6 +1150,7 @@ _defineProperty(SuggestionsOverlay, "propTypes", {
|
|
1148
1150
|
focusIndex: PropTypes.number,
|
1149
1151
|
position: PropTypes.string,
|
1150
1152
|
left: PropTypes.number,
|
1153
|
+
right: PropTypes.number,
|
1151
1154
|
top: PropTypes.number,
|
1152
1155
|
scrollFocusedIntoView: PropTypes.bool,
|
1153
1156
|
isLoading: PropTypes.bool,
|
@@ -1349,13 +1352,15 @@ function (_React$Component) {
|
|
1349
1352
|
var _this$state$suggestio = _this.state.suggestionsPosition,
|
1350
1353
|
position = _this$state$suggestio.position,
|
1351
1354
|
left = _this$state$suggestio.left,
|
1352
|
-
top = _this$state$suggestio.top
|
1355
|
+
top = _this$state$suggestio.top,
|
1356
|
+
right = _this$state$suggestio.right;
|
1353
1357
|
var suggestionsNode = React__default.createElement(SuggestionsOverlay$1, {
|
1354
1358
|
id: _this.uuidSuggestionsOverlay,
|
1355
1359
|
style: _this.props.style('suggestions'),
|
1356
1360
|
position: position,
|
1357
1361
|
left: left,
|
1358
1362
|
top: top,
|
1363
|
+
right: right,
|
1359
1364
|
focusIndex: _this.state.focusIndex,
|
1360
1365
|
scrollFocusedIntoView: _this.state.scrollFocusedIntoView,
|
1361
1366
|
containerRef: _this.setSuggestionsElement,
|
@@ -2002,7 +2007,11 @@ function (_React$Component) {
|
|
2002
2007
|
value: newValue
|
2003
2008
|
})
|
2004
2009
|
};
|
2005
|
-
this.executeOnChange(eventMock, newValue, newPlainTextValue, getMentions(newValue, config));
|
2010
|
+
this.executeOnChange(eventMock, newValue, newPlainTextValue, getMentions(newValue, config)); // Move the cursor position to the end of the pasted data
|
2011
|
+
|
2012
|
+
var startOfMention = findStartOfMentionInPlainText(value, config, selectionStart);
|
2013
|
+
var nextPos = (startOfMention || selectionStart) + getPlainText(pastedMentions || pastedData, config).length;
|
2014
|
+
this.setSelection(nextPos, nextPos);
|
2006
2015
|
}
|
2007
2016
|
}, {
|
2008
2017
|
key: "saveSelectionToClipboard",
|
@@ -645,10 +645,11 @@ var SuggestionsOverlay = function(_Component) {
|
|
645
645
|
}, {
|
646
646
|
key: "render",
|
647
647
|
value: function() {
|
648
|
-
var _this$props = this.props, id = _this$props.id, a11ySuggestionsListLabel = _this$props.a11ySuggestionsListLabel, isOpened = _this$props.isOpened, style = _this$props.style, onMouseDown = _this$props.onMouseDown, containerRef = _this$props.containerRef, position = _this$props.position, left = _this$props.left, top = _this$props.top;
|
648
|
+
var _this$props = this.props, id = _this$props.id, a11ySuggestionsListLabel = _this$props.a11ySuggestionsListLabel, isOpened = _this$props.isOpened, style = _this$props.style, onMouseDown = _this$props.onMouseDown, containerRef = _this$props.containerRef, position = _this$props.position, left = _this$props.left, right = _this$props.right, top = _this$props.top;
|
649
649
|
return isOpened ? React__default.createElement("div", _extends({}, useStyles.inline({
|
650
650
|
position: position || "absolute",
|
651
651
|
left: left,
|
652
|
+
right: right,
|
652
653
|
top: top
|
653
654
|
}, style), {
|
654
655
|
onMouseDown: onMouseDown,
|
@@ -710,6 +711,7 @@ _defineProperty(SuggestionsOverlay, "propTypes", {
|
|
710
711
|
focusIndex: PropTypes.number,
|
711
712
|
position: PropTypes.string,
|
712
713
|
left: PropTypes.number,
|
714
|
+
right: PropTypes.number,
|
713
715
|
top: PropTypes.number,
|
714
716
|
scrollFocusedIntoView: PropTypes.bool,
|
715
717
|
isLoading: PropTypes.bool,
|
@@ -846,12 +848,13 @@ var makeTriggerRegex = function(trigger) {
|
|
846
848
|
_this.suggestionsElement = el;
|
847
849
|
}), _defineProperty(_assertThisInitialized(_this), "renderSuggestionsOverlay", function() {
|
848
850
|
if (!isNumber(_this.state.selectionStart)) return null;
|
849
|
-
var _this$state$suggestio = _this.state.suggestionsPosition, position = _this$state$suggestio.position, left = _this$state$suggestio.left, top = _this$state$suggestio.top, suggestionsNode = React__default.createElement(SuggestionsOverlay$1, {
|
851
|
+
var _this$state$suggestio = _this.state.suggestionsPosition, position = _this$state$suggestio.position, left = _this$state$suggestio.left, top = _this$state$suggestio.top, right = _this$state$suggestio.right, suggestionsNode = React__default.createElement(SuggestionsOverlay$1, {
|
850
852
|
id: _this.uuidSuggestionsOverlay,
|
851
853
|
style: _this.props.style("suggestions"),
|
852
854
|
position: position,
|
853
855
|
left: left,
|
854
856
|
top: top,
|
857
|
+
right: right,
|
855
858
|
focusIndex: _this.state.focusIndex,
|
856
859
|
scrollFocusedIntoView: _this.state.scrollFocusedIntoView,
|
857
860
|
containerRef: _this.setSuggestionsElement,
|
@@ -1135,6 +1138,8 @@ var makeTriggerRegex = function(trigger) {
|
|
1135
1138
|
})
|
1136
1139
|
};
|
1137
1140
|
this.executeOnChange(eventMock, newValue, newPlainTextValue, getMentions(newValue, config));
|
1141
|
+
var nextPos = (findStartOfMentionInPlainText(value, config, selectionStart) || selectionStart) + getPlainText(pastedMentions || pastedData, config).length;
|
1142
|
+
this.setSelection(nextPos, nextPos);
|
1138
1143
|
}
|
1139
1144
|
}
|
1140
1145
|
}, {
|
@@ -1056,6 +1056,7 @@ function (_Component) {
|
|
1056
1056
|
containerRef = _this$props.containerRef,
|
1057
1057
|
position = _this$props.position,
|
1058
1058
|
left = _this$props.left,
|
1059
|
+
right = _this$props.right,
|
1059
1060
|
top = _this$props.top; // do not show suggestions until there is some data
|
1060
1061
|
|
1061
1062
|
if (!isOpened) {
|
@@ -1065,6 +1066,7 @@ function (_Component) {
|
|
1065
1066
|
return React.createElement("div", _extends({}, inline({
|
1066
1067
|
position: position || 'absolute',
|
1067
1068
|
left: left,
|
1069
|
+
right: right,
|
1068
1070
|
top: top
|
1069
1071
|
}, style), {
|
1070
1072
|
onMouseDown: onMouseDown,
|
@@ -1140,6 +1142,7 @@ _defineProperty(SuggestionsOverlay, "propTypes", {
|
|
1140
1142
|
focusIndex: PropTypes.number,
|
1141
1143
|
position: PropTypes.string,
|
1142
1144
|
left: PropTypes.number,
|
1145
|
+
right: PropTypes.number,
|
1143
1146
|
top: PropTypes.number,
|
1144
1147
|
scrollFocusedIntoView: PropTypes.bool,
|
1145
1148
|
isLoading: PropTypes.bool,
|
@@ -1341,13 +1344,15 @@ function (_React$Component) {
|
|
1341
1344
|
var _this$state$suggestio = _this.state.suggestionsPosition,
|
1342
1345
|
position = _this$state$suggestio.position,
|
1343
1346
|
left = _this$state$suggestio.left,
|
1344
|
-
top = _this$state$suggestio.top
|
1347
|
+
top = _this$state$suggestio.top,
|
1348
|
+
right = _this$state$suggestio.right;
|
1345
1349
|
var suggestionsNode = React.createElement(SuggestionsOverlay$1, {
|
1346
1350
|
id: _this.uuidSuggestionsOverlay,
|
1347
1351
|
style: _this.props.style('suggestions'),
|
1348
1352
|
position: position,
|
1349
1353
|
left: left,
|
1350
1354
|
top: top,
|
1355
|
+
right: right,
|
1351
1356
|
focusIndex: _this.state.focusIndex,
|
1352
1357
|
scrollFocusedIntoView: _this.state.scrollFocusedIntoView,
|
1353
1358
|
containerRef: _this.setSuggestionsElement,
|
@@ -1994,7 +1999,11 @@ function (_React$Component) {
|
|
1994
1999
|
value: newValue
|
1995
2000
|
})
|
1996
2001
|
};
|
1997
|
-
this.executeOnChange(eventMock, newValue, newPlainTextValue, getMentions(newValue, config));
|
2002
|
+
this.executeOnChange(eventMock, newValue, newPlainTextValue, getMentions(newValue, config)); // Move the cursor position to the end of the pasted data
|
2003
|
+
|
2004
|
+
var startOfMention = findStartOfMentionInPlainText(value, config, selectionStart);
|
2005
|
+
var nextPos = (startOfMention || selectionStart) + getPlainText(pastedMentions || pastedData, config).length;
|
2006
|
+
this.setSelection(nextPos, nextPos);
|
1998
2007
|
}
|
1999
2008
|
}, {
|
2000
2009
|
key: "saveSelectionToClipboard",
|