@atlaskit/mention 23.9.0 → 23.10.0

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/mention
 
+## 23.10.0
+
+### Minor Changes
+
+- [#105029](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/105029)
+  [`d32ea9117bf88`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/d32ea9117bf88) -
+  Add support for React 18
+
 ## 23.9.0
 
 ### Minor Changes

package/dist/cjs/api/MentionResource.js

@@ -187,7 +187,6 @@ var MentionResource = exports.MentionResource = /*#__PURE__*/function (_Abstract
     _this.productName = config.productName;
     _this.shouldEnableInvite = !!config.shouldEnableInvite;
     _this.onInviteItemClick = config.onInviteItemClick;
-    _this.isEligibleXProductUserInvite = config.isEligibleXProductUserInvite;
     _this.inviteXProductUser = config.inviteXProductUser;
     _this.userRole = config.userRole || 'basic';
     if (_this.config.debounceTime) {

package/dist/cjs/components/Mention/PrimitiveMention.js

@@ -15,6 +15,7 @@ var _types = require("../../types");
 var _react2 = require("react");
 var _templateObject;
 var _excluded = ["mentionType"];
+/* eslint-disable @atlaskit/design-system/no-html-button */
 /**
  * @jsxRuntime classic
  * @jsx jsx

package/dist/cjs/components/Mention/index.js

@@ -124,12 +124,16 @@ var MentionInternal = exports.MentionInternal = /*#__PURE__*/function (_React$Pu
         localId = props.localId;
       var mentionType = this.getMentionType();
       var failedMention = text === "@".concat(UNKNOWN_USER_ID);
+      var showTooltip = mentionType === _types.MentionType.RESTRICTED;
       var mentionComponent = /*#__PURE__*/_react.default.createElement(_focusRing.default, null, /*#__PURE__*/_react.default.createElement(_PrimitiveMention.default, {
         mentionType: mentionType,
         onClick: handleOnClick,
         onMouseEnter: handleOnMouseEnter,
         onMouseLeave: handleOnMouseLeave,
-        spellCheck: false
+        spellCheck: false,
+        "data-testid": "mention-".concat(id),
+        "data-mention-type": mentionType,
+        "data-mention-tooltip": showTooltip
       }, failedMention ? this.renderUnknownUserError(id) : text || '@...'));
       return /*#__PURE__*/_react.default.createElement(_ufoExperiences.UfoErrorBoundary, {
         id: id
@@ -139,7 +143,7 @@ var MentionInternal = exports.MentionInternal = /*#__PURE__*/function (_React$Pu
         "data-local-id": localId,
         "data-access-level": accessLevel,
         spellCheck: false
-      }, /*#__PURE__*/_react.default.createElement(_MessagesIntlProvider.default, null, mentionType === _types.MentionType.RESTRICTED ? /*#__PURE__*/_react.default.createElement(_react.default.Suspense, {
+      }, /*#__PURE__*/_react.default.createElement(_MessagesIntlProvider.default, null, showTooltip ? /*#__PURE__*/_react.default.createElement(_react.default.Suspense, {
         fallback: mentionComponent
       }, /*#__PURE__*/_react.default.createElement(_NoAccessTooltip.default, {
         name: text

package/dist/cjs/components/MentionDescriptionByline/index.js

@@ -11,9 +11,12 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _react = _interopRequireDefault(require("react"));
+var _reactIntlNext = require("react-intl-next");
 var _types = require("../../types");
 var _UserMentionDescriptionByline = _interopRequireDefault(require("./UserMentionDescriptionByline"));
 var _TeamMentionDescriptionByline = _interopRequireDefault(require("./TeamMentionDescriptionByline"));
+var _styles = require("./styles");
+var _i18n = require("../i18n");
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 var MentionDescriptionByline = exports.default = /*#__PURE__*/function (_React$PureComponent) {
@@ -25,7 +28,12 @@ var MentionDescriptionByline = exports.default = /*#__PURE__*/function (_React$P
   return (0, _createClass2.default)(MentionDescriptionByline, [{
     key: "render",
     value: function render() {
-      var userType = this.props.mention.userType;
+      var _this$props$mention = this.props.mention,
+        userType = _this$props$mention.userType,
+        isXProductUser = _this$props$mention.isXProductUser;
+      if (isXProductUser) {
+        return /*#__PURE__*/_react.default.createElement(_styles.DescriptionBylineStyle, null, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _i18n.messages.xProductMentionDescription));
+      }
       switch (userType) {
         case _types.UserType[_types.UserType.TEAM]:
           {

package/dist/cjs/components/MentionItem/index.js

@@ -22,6 +22,7 @@ var _avatar = _interopRequireDefault(require("@atlaskit/avatar"));
 var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
 var _colors = require("@atlaskit/theme/colors");
 var _react = _interopRequireDefault(require("react"));
+var _informationEditorPanel = _interopRequireDefault(require("@atlaskit/icon/core/migration/information--editor-panel"));
 var _types = require("../../types");
 var _i18n = require("../../util/i18n");
 var _mouse = require("../../util/mouse");
@@ -93,20 +94,25 @@ var MentionItem = exports.default = /*#__PURE__*/function (_React$PureComponent)
         name = mention.name,
         mentionName = mention.mentionName,
         lozenge = mention.lozenge,
-        accessLevel = mention.accessLevel;
+        accessLevel = mention.accessLevel,
+        isXProductUser = mention.isXProductUser;
       var _ref = presence || {},
         status = _ref.status,
         time = _ref.time;
       var restricted = (0, _types.isRestricted)(accessLevel);
       var nameHighlights = highlight && highlight.name;
       var borderColor = selected ? "var(--ds-border, ".concat(_colors.N30, ")") : undefined;
+      var xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #0C66E4)" : "var(--ds-icon, #44546F)";
       return /*#__PURE__*/_react.default.createElement(_MessagesIntlProvider.default, null, /*#__PURE__*/_react.default.createElement(_styles.MentionItemStyle, {
         selected: selected,
         onMouseDown: this.onMentionSelected,
         onMouseMove: this.onMentionMenuItemMouseMove,
         onMouseEnter: this.onMentionMenuItemMouseEnter,
+        "data-mention-item": true,
+        "data-testid": "mention-item-".concat(id),
         "data-mention-id": id,
-        "data-mention-name": mentionName
+        "data-mention-name": mentionName,
+        "data-selected": selected
       }, /*#__PURE__*/_react.default.createElement(_styles.RowStyle, null, /*#__PURE__*/_react.default.createElement(_styles.AvatarStyle, {
         restricted: restricted
       }, /*#__PURE__*/_react.default.createElement(_avatar.default, {
@@ -128,7 +134,10 @@ var MentionItem = exports.default = /*#__PURE__*/function (_React$PureComponent)
         return /*#__PURE__*/_react.default.createElement(_LockCircleIcon.default, {
           label: text
         });
-      } /* safe to cast to string given there is no value binding */)))) : null)));
+      } /* safe to cast to string given there is no value binding */)))) : null, isXProductUser && /*#__PURE__*/_react.default.createElement(_informationEditorPanel.default, {
+        color: xProductUserInfoIconColor,
+        label: ''
+      }))));
     }
   }]);
 }(_react.default.PureComponent);

package/dist/cjs/components/i18n.js

@@ -60,5 +60,10 @@ var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
     id: 'fabric.elements.mentions.team.member.50plus.including.you',
     defaultMessage: 'Team • 50+ members, including you',
     description: 'Byline to show the number of members in the team when the number exceeds 50 and also includes the current user'
+  },
+  xProductMentionDescription: {
+    id: 'fabric.elements.mentions.xproduct.mention.description',
+    defaultMessage: 'Needs access to Confluence',
+    description: 'Description for a x-product mention item in the mention list in Confluence'
   }
 });

package/dist/cjs/util/analytics.js

@@ -12,7 +12,7 @@ var _types = require("../types");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var packageName = "@atlaskit/mention";
-var packageVersion = "23.9.0";
+var packageVersion = "23.10.0";
 var SLI_EVENT_TYPE = exports.SLI_EVENT_TYPE = 'sli';
 var SMART_EVENT_TYPE = exports.SMART_EVENT_TYPE = 'smart';
 var fireAnalyticsMentionTypeaheadEvent = exports.fireAnalyticsMentionTypeaheadEvent = function fireAnalyticsMentionTypeaheadEvent(props) {

package/dist/es2019/api/MentionResource.js

@@ -137,7 +137,6 @@ export class MentionResource extends AbstractMentionResource {
     this.productName = config.productName;
     this.shouldEnableInvite = !!config.shouldEnableInvite;
     this.onInviteItemClick = config.onInviteItemClick;
-    this.isEligibleXProductUserInvite = config.isEligibleXProductUserInvite;
     this.inviteXProductUser = config.inviteXProductUser;
     this.userRole = config.userRole || 'basic';
     if (this.config.debounceTime) {

package/dist/es2019/components/Mention/PrimitiveMention.js

@@ -1,4 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
+/* eslint-disable @atlaskit/design-system/no-html-button */
 /**
  * @jsxRuntime classic
  * @jsx jsx

package/dist/es2019/components/Mention/index.js

@@ -104,12 +104,16 @@ export class MentionInternal extends React.PureComponent {
     } = props;
     const mentionType = this.getMentionType();
     const failedMention = text === `@${UNKNOWN_USER_ID}`;
+    const showTooltip = mentionType === MentionType.RESTRICTED;
     const mentionComponent = /*#__PURE__*/React.createElement(FocusRing, null, /*#__PURE__*/React.createElement(PrimitiveMention, {
       mentionType: mentionType,
       onClick: handleOnClick,
       onMouseEnter: handleOnMouseEnter,
       onMouseLeave: handleOnMouseLeave,
-      spellCheck: false
+      spellCheck: false,
+      "data-testid": `mention-${id}`,
+      "data-mention-type": mentionType,
+      "data-mention-tooltip": showTooltip
     }, failedMention ? this.renderUnknownUserError(id) : text || '@...'));
     return /*#__PURE__*/React.createElement(UfoErrorBoundary, {
       id: id
@@ -119,7 +123,7 @@ export class MentionInternal extends React.PureComponent {
       "data-local-id": localId,
       "data-access-level": accessLevel,
       spellCheck: false
-    }, /*#__PURE__*/React.createElement(MessagesIntlProvider, null, mentionType === MentionType.RESTRICTED ? /*#__PURE__*/React.createElement(React.Suspense, {
+    }, /*#__PURE__*/React.createElement(MessagesIntlProvider, null, showTooltip ? /*#__PURE__*/React.createElement(React.Suspense, {
       fallback: mentionComponent
     }, /*#__PURE__*/React.createElement(AsyncNoAccessTooltip, {
       name: text

package/dist/es2019/components/MentionDescriptionByline/index.js

@@ -1,12 +1,19 @@
 import React from 'react';
+import { FormattedMessage } from 'react-intl-next';
 import { UserType } from '../../types';
 import UserMentionDescriptionByline from './UserMentionDescriptionByline';
 import TeamMentionDescriptionByline from './TeamMentionDescriptionByline';
+import { DescriptionBylineStyle } from './styles';
+import { messages } from '../i18n';
 export default class MentionDescriptionByline extends React.PureComponent {
   render() {
     const {
-      userType
+      userType,
+      isXProductUser
     } = this.props.mention;
+    if (isXProductUser) {
+      return /*#__PURE__*/React.createElement(DescriptionBylineStyle, null, /*#__PURE__*/React.createElement(FormattedMessage, messages.xProductMentionDescription));
+    }
     switch (userType) {
       case UserType[UserType.TEAM]:
         {

package/dist/es2019/components/MentionItem/index.js

@@ -3,6 +3,7 @@ import Avatar from '@atlaskit/avatar';
 import Lozenge from '@atlaskit/lozenge';
 import { N30 } from '@atlaskit/theme/colors';
 import React from 'react';
+import EditorPanelIcon from '@atlaskit/icon/core/migration/information--editor-panel';
 import { isRestricted } from '../../types';
 import { NoAccessLabel } from '../../util/i18n';
 import { leftClick } from '../../util/mouse';
@@ -68,7 +69,8 @@ export default class MentionItem extends React.PureComponent {
       name,
       mentionName,
       lozenge,
-      accessLevel
+      accessLevel,
+      isXProductUser
     } = mention;
     const {
       status,
@@ -77,13 +79,17 @@ export default class MentionItem extends React.PureComponent {
     const restricted = isRestricted(accessLevel);
     const nameHighlights = highlight && highlight.name;
     const borderColor = selected ? `var(--ds-border, ${N30})` : undefined;
+    const xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #0C66E4)" : "var(--ds-icon, #44546F)";
     return /*#__PURE__*/React.createElement(MessagesIntlProvider, null, /*#__PURE__*/React.createElement(MentionItemStyle, {
       selected: selected,
       onMouseDown: this.onMentionSelected,
       onMouseMove: this.onMentionMenuItemMouseMove,
       onMouseEnter: this.onMentionMenuItemMouseEnter,
+      "data-mention-item": true,
+      "data-testid": `mention-item-${id}`,
       "data-mention-id": id,
-      "data-mention-name": mentionName
+      "data-mention-name": mentionName,
+      "data-selected": selected
     }, /*#__PURE__*/React.createElement(RowStyle, null, /*#__PURE__*/React.createElement(AvatarStyle, {
       restricted: restricted
     }, /*#__PURE__*/React.createElement(Avatar, {
@@ -103,6 +109,9 @@ export default class MentionItem extends React.PureComponent {
       name: name
     }, /*#__PURE__*/React.createElement(AccessSectionStyle, null, /*#__PURE__*/React.createElement(NoAccessLabel, null, text => /*#__PURE__*/React.createElement(AsyncLockCircleIcon, {
       label: text
-    }) /* safe to cast to string given there is no value binding */)))) : null)));
+    }) /* safe to cast to string given there is no value binding */)))) : null, isXProductUser && /*#__PURE__*/React.createElement(EditorPanelIcon, {
+      color: xProductUserInfoIconColor,
+      label: ''
+    }))));
   }
 }

package/dist/es2019/components/i18n.js

@@ -54,5 +54,10 @@ export const messages = defineMessages({
     id: 'fabric.elements.mentions.team.member.50plus.including.you',
     defaultMessage: 'Team • 50+ members, including you',
     description: 'Byline to show the number of members in the team when the number exceeds 50 and also includes the current user'
+  },
+  xProductMentionDescription: {
+    id: 'fabric.elements.mentions.xproduct.mention.description',
+    defaultMessage: 'Needs access to Confluence',
+    description: 'Description for a x-product mention item in the mention list in Confluence'
   }
 });

package/dist/es2019/util/analytics.js

@@ -2,7 +2,7 @@ import { OPERATIONAL_EVENT_TYPE, UI_EVENT_TYPE } from '@atlaskit/analytics-gas-t
 import { ELEMENTS_CHANNEL } from '../_constants';
 import { ComponentNames, isSpecialMentionText } from '../types';
 const packageName = "@atlaskit/mention";
-const packageVersion = "23.9.0";
+const packageVersion = "23.10.0";
 export const SLI_EVENT_TYPE = 'sli';
 export const SMART_EVENT_TYPE = 'smart';
 export const fireAnalyticsMentionTypeaheadEvent = props => (action, duration, userIds = [], query) => {

package/dist/esm/api/MentionResource.js

@@ -180,7 +180,6 @@ export var MentionResource = /*#__PURE__*/function (_AbstractMentionResou) {
     _this.productName = config.productName;
     _this.shouldEnableInvite = !!config.shouldEnableInvite;
     _this.onInviteItemClick = config.onInviteItemClick;
-    _this.isEligibleXProductUserInvite = config.isEligibleXProductUserInvite;
     _this.inviteXProductUser = config.inviteXProductUser;
     _this.userRole = config.userRole || 'basic';
     if (_this.config.debounceTime) {

package/dist/esm/components/Mention/PrimitiveMention.js

@@ -4,6 +4,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _templateObject;
 var _excluded = ["mentionType"];
+/* eslint-disable @atlaskit/design-system/no-html-button */
 /**
  * @jsxRuntime classic
  * @jsx jsx

package/dist/esm/components/Mention/index.js

@@ -117,12 +117,16 @@ export var MentionInternal = /*#__PURE__*/function (_React$PureComponent) {
         localId = props.localId;
       var mentionType = this.getMentionType();
       var failedMention = text === "@".concat(UNKNOWN_USER_ID);
+      var showTooltip = mentionType === MentionType.RESTRICTED;
       var mentionComponent = /*#__PURE__*/React.createElement(FocusRing, null, /*#__PURE__*/React.createElement(PrimitiveMention, {
         mentionType: mentionType,
         onClick: handleOnClick,
         onMouseEnter: handleOnMouseEnter,
         onMouseLeave: handleOnMouseLeave,
-        spellCheck: false
+        spellCheck: false,
+        "data-testid": "mention-".concat(id),
+        "data-mention-type": mentionType,
+        "data-mention-tooltip": showTooltip
       }, failedMention ? this.renderUnknownUserError(id) : text || '@...'));
       return /*#__PURE__*/React.createElement(UfoErrorBoundary, {
         id: id
@@ -132,7 +136,7 @@ export var MentionInternal = /*#__PURE__*/function (_React$PureComponent) {
         "data-local-id": localId,
         "data-access-level": accessLevel,
         spellCheck: false
-      }, /*#__PURE__*/React.createElement(MessagesIntlProvider, null, mentionType === MentionType.RESTRICTED ? /*#__PURE__*/React.createElement(React.Suspense, {
+      }, /*#__PURE__*/React.createElement(MessagesIntlProvider, null, showTooltip ? /*#__PURE__*/React.createElement(React.Suspense, {
         fallback: mentionComponent
       }, /*#__PURE__*/React.createElement(AsyncNoAccessTooltip, {
         name: text

package/dist/esm/components/MentionDescriptionByline/index.js

@@ -6,9 +6,12 @@ import _inherits from "@babel/runtime/helpers/inherits";
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import React from 'react';
+import { FormattedMessage } from 'react-intl-next';
 import { UserType } from '../../types';
 import UserMentionDescriptionByline from './UserMentionDescriptionByline';
 import TeamMentionDescriptionByline from './TeamMentionDescriptionByline';
+import { DescriptionBylineStyle } from './styles';
+import { messages } from '../i18n';
 var MentionDescriptionByline = /*#__PURE__*/function (_React$PureComponent) {
   function MentionDescriptionByline() {
     _classCallCheck(this, MentionDescriptionByline);
@@ -18,7 +21,12 @@ var MentionDescriptionByline = /*#__PURE__*/function (_React$PureComponent) {
   return _createClass(MentionDescriptionByline, [{
     key: "render",
     value: function render() {
-      var userType = this.props.mention.userType;
+      var _this$props$mention = this.props.mention,
+        userType = _this$props$mention.userType,
+        isXProductUser = _this$props$mention.isXProductUser;
+      if (isXProductUser) {
+        return /*#__PURE__*/React.createElement(DescriptionBylineStyle, null, /*#__PURE__*/React.createElement(FormattedMessage, messages.xProductMentionDescription));
+      }
       switch (userType) {
         case UserType[UserType.TEAM]:
           {

package/dist/esm/components/MentionItem/index.js

@@ -11,6 +11,7 @@ import Avatar from '@atlaskit/avatar';
 import Lozenge from '@atlaskit/lozenge';
 import { N30 } from '@atlaskit/theme/colors';
 import React from 'react';
+import EditorPanelIcon from '@atlaskit/icon/core/migration/information--editor-panel';
 import { isRestricted } from '../../types';
 import { NoAccessLabel } from '../../util/i18n';
 import { leftClick } from '../../util/mouse';
@@ -81,20 +82,25 @@ var MentionItem = /*#__PURE__*/function (_React$PureComponent) {
         name = mention.name,
         mentionName = mention.mentionName,
         lozenge = mention.lozenge,
-        accessLevel = mention.accessLevel;
+        accessLevel = mention.accessLevel,
+        isXProductUser = mention.isXProductUser;
       var _ref = presence || {},
         status = _ref.status,
         time = _ref.time;
       var restricted = isRestricted(accessLevel);
       var nameHighlights = highlight && highlight.name;
       var borderColor = selected ? "var(--ds-border, ".concat(N30, ")") : undefined;
+      var xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #0C66E4)" : "var(--ds-icon, #44546F)";
       return /*#__PURE__*/React.createElement(MessagesIntlProvider, null, /*#__PURE__*/React.createElement(MentionItemStyle, {
         selected: selected,
         onMouseDown: this.onMentionSelected,
         onMouseMove: this.onMentionMenuItemMouseMove,
         onMouseEnter: this.onMentionMenuItemMouseEnter,
+        "data-mention-item": true,
+        "data-testid": "mention-item-".concat(id),
         "data-mention-id": id,
-        "data-mention-name": mentionName
+        "data-mention-name": mentionName,
+        "data-selected": selected
       }, /*#__PURE__*/React.createElement(RowStyle, null, /*#__PURE__*/React.createElement(AvatarStyle, {
         restricted: restricted
       }, /*#__PURE__*/React.createElement(Avatar, {
@@ -116,7 +122,10 @@ var MentionItem = /*#__PURE__*/function (_React$PureComponent) {
         return /*#__PURE__*/React.createElement(AsyncLockCircleIcon, {
           label: text
         });
-      } /* safe to cast to string given there is no value binding */)))) : null)));
+      } /* safe to cast to string given there is no value binding */)))) : null, isXProductUser && /*#__PURE__*/React.createElement(EditorPanelIcon, {
+        color: xProductUserInfoIconColor,
+        label: ''
+      }))));
     }
   }]);
 }(React.PureComponent);

package/dist/esm/components/i18n.js

@@ -54,5 +54,10 @@ export var messages = defineMessages({
     id: 'fabric.elements.mentions.team.member.50plus.including.you',
     defaultMessage: 'Team • 50+ members, including you',
     description: 'Byline to show the number of members in the team when the number exceeds 50 and also includes the current user'
+  },
+  xProductMentionDescription: {
+    id: 'fabric.elements.mentions.xproduct.mention.description',
+    defaultMessage: 'Needs access to Confluence',
+    description: 'Description for a x-product mention item in the mention list in Confluence'
   }
 });

package/dist/esm/util/analytics.js

@@ -5,7 +5,7 @@ import { OPERATIONAL_EVENT_TYPE, UI_EVENT_TYPE } from '@atlaskit/analytics-gas-t
 import { ELEMENTS_CHANNEL } from '../_constants';
 import { ComponentNames, isSpecialMentionText } from '../types';
 var packageName = "@atlaskit/mention";
-var packageVersion = "23.9.0";
+var packageVersion = "23.10.0";
 export var SLI_EVENT_TYPE = 'sli';
 export var SMART_EVENT_TYPE = 'smart';
 export var fireAnalyticsMentionTypeaheadEvent = function fireAnalyticsMentionTypeaheadEvent(props) {

package/dist/types/api/MentionResource.d.ts

@@ -45,7 +45,6 @@ export declare class MentionResource extends AbstractMentionResource implements
     shouldEnableInvite: boolean;
     userRole: UserRole;
     onInviteItemClick?: (flow: InviteFlow) => void;
-    isEligibleXProductUserInvite?: boolean;
     inviteXProductUser?: (userId: string, mentionName: string) => Promise<void>;
     constructor(config: MentionResourceConfig);
     shouldHighlightMention(mention: MentionDescription): boolean;

package/dist/types/components/i18n.d.ts

@@ -54,4 +54,9 @@ export declare const messages: {
         defaultMessage: string;
         description: string;
     };
+    xProductMentionDescription: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
 };

package/dist/types/types.d.ts

@@ -31,7 +31,6 @@ export interface MentionResourceConfig extends ServiceConfig {
     userRole?: UserRole;
     productName?: string;
     debounceTime?: number;
-    isEligibleXProductUserInvite?: boolean;
     inviteXProductUser?: (userId: string, mentionName: string) => Promise<void>;
 }
 export interface ResourceProvider<Result> {
@@ -185,6 +184,5 @@ export interface InviteFromMentionProvider {
     userRole?: UserRole;
 }
 export interface XProductInviteMentionProvider {
-    isEligibleXProductUserInvite?: boolean;
     inviteXProductUser?: (userId: string, mentionName: string) => Promise<void>;
 }

package/dist/types-ts4.5/api/MentionResource.d.ts

@@ -45,7 +45,6 @@ export declare class MentionResource extends AbstractMentionResource implements
     shouldEnableInvite: boolean;
     userRole: UserRole;
     onInviteItemClick?: (flow: InviteFlow) => void;
-    isEligibleXProductUserInvite?: boolean;
     inviteXProductUser?: (userId: string, mentionName: string) => Promise<void>;
     constructor(config: MentionResourceConfig);
     shouldHighlightMention(mention: MentionDescription): boolean;

package/dist/types-ts4.5/components/i18n.d.ts

@@ -54,4 +54,9 @@ export declare const messages: {
         defaultMessage: string;
         description: string;
     };
+    xProductMentionDescription: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
 };

package/dist/types-ts4.5/types.d.ts

@@ -31,7 +31,6 @@ export interface MentionResourceConfig extends ServiceConfig {
     userRole?: UserRole;
     productName?: string;
     debounceTime?: number;
-    isEligibleXProductUserInvite?: boolean;
     inviteXProductUser?: (userId: string, mentionName: string) => Promise<void>;
 }
 export interface ResourceProvider<Result> {
@@ -185,6 +184,5 @@ export interface InviteFromMentionProvider {
     userRole?: UserRole;
 }
 export interface XProductInviteMentionProvider {
-    isEligibleXProductUserInvite?: boolean;
     inviteXProductUser?: (userId: string, mentionName: string) => Promise<void>;
 }

package/package.json

@@ -1,29 +1,19 @@
 {
-	"name": "@atlaskit/mention",
-	"version": "23.9.0",
-	"description": "A React component used to display user profiles in a list for 'Mention' functionality",
-	"publishConfig": {
-		"registry": "https://registry.npmjs.org/"
-	},
-	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
-	"author": "Atlassian Pty Ltd",
-	"license": "Apache-2.0",
-	"main": "dist/cjs/index.js",
-	"module": "dist/esm/index.js",
-	"module:es2019": "dist/es2019/index.js",
-	"types": "dist/types/index.d.ts",
-	"typesVersions": {
-		">=4.5 <4.9": {
-			"*": [
-				"dist/types-ts4.5/*",
-				"dist/types-ts4.5/index.d.ts"
-			]
-		}
+	"af:exports": {
+		".": "./src/index.ts",
+		"./element": "./src/element.ts",
+		"./i18n": "./src/i18n.ts",
+		"./item": "./src/item.ts",
+		"./resource": "./src/resource.ts",
+		"./shared-styles": "./src/shared-styles.ts",
+		"./team-resource": "./src/team-resource.ts",
+		"./typeahead": "./src/typeahead.ts",
+		"./types": "./src/types.ts"
 	},
-	"sideEffects": false,
 	"atlaskit:src": "src/index.ts",
 	"atlassian": {
 		"team": "Search Platform: Search Experience",
+		"runReact18": false,
 		"slack": {
 			"channel": "#search-plex-prs",
 			"notifications": {
@@ -36,6 +26,7 @@
 			"name": "Mention"
 		}
 	},
+	"author": "Atlassian Pty Ltd",
 	"config": {
 		"access": "public"
 	},
@@ -50,7 +41,7 @@
 		"@atlaskit/platform-feature-flags": "^0.3.0",
 		"@atlaskit/primitives": "^13.3.0",
 		"@atlaskit/theme": "^14.0.0",
-		"@atlaskit/tokens": "^3.1.0",
+		"@atlaskit/tokens": "^3.2.0",
 		"@atlaskit/tooltip": "^19.0.0",
 		"@atlaskit/ufo": "^0.3.0",
 		"@atlaskit/util-service-support": "^6.2.0",
@@ -60,16 +51,13 @@
 		"lodash": "^4.17.21",
 		"uuid": "^3.1.0"
 	},
-	"peerDependencies": {
-		"react": "^16.8.0",
-		"react-dom": "^16.8.0",
-		"react-intl-next": "npm:react-intl@^5.18.1"
-	},
+	"description": "A React component used to display user profiles in a list for 'Mention' functionality",
 	"devDependencies": {
 		"@atlaskit/elements-test-helpers": "^0.7.0",
 		"@atlaskit/visual-regression": "*",
 		"@atlassian/feature-flags-test-utils": "*",
 		"@testing-library/react": "^12.1.5",
+		"@testing-library/user-event": "^14.4.3",
 		"@types/query-string": "^4.3.1",
 		"@types/serialize-javascript": "^5.0.0",
 		"enzyme": "^3.10.0",
@@ -90,29 +78,43 @@
 		"fabric",
 		"teams"
 	],
+	"license": "Apache-2.0",
+	"main": "dist/cjs/index.js",
+	"module": "dist/esm/index.js",
+	"module:es2019": "dist/es2019/index.js",
+	"name": "@atlaskit/mention",
+	"peerDependencies": {
+		"react": "^16.8.0 || ^17.0.0 || ^18.2.0",
+		"react-dom": "^16.8.0 || ^17.0.0 || ^18.2.0",
+		"react-intl-next": "npm:react-intl@^5.18.1"
+	},
+	"platform-feature-flags": {
+		"platform_editor_ai_remove_mentions_record": {
+			"type": "boolean"
+		}
+	},
+	"publishConfig": {
+		"registry": "https://registry.npmjs.org/"
+	},
+	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
+	"sideEffects": false,
 	"techstack": {
 		"@repo/internal": {
 			"deprecation": "no-deprecated-imports",
-			"styling": "emotion",
 			"design-tokens": [
 				"color"
-			]
+			],
+			"styling": "emotion"
 		}
 	},
-	"af:exports": {
-		".": "./src/index.ts",
-		"./element": "./src/element.ts",
-		"./i18n": "./src/i18n.ts",
-		"./item": "./src/item.ts",
-		"./resource": "./src/resource.ts",
-		"./shared-styles": "./src/shared-styles.ts",
-		"./team-resource": "./src/team-resource.ts",
-		"./typeahead": "./src/typeahead.ts",
-		"./types": "./src/types.ts"
-	},
-	"platform-feature-flags": {
-		"platform_editor_ai_remove_mentions_record": {
-			"type": "boolean"
+	"types": "dist/types/index.d.ts",
+	"typesVersions": {
+		">=4.5 <4.9": {
+			"*": [
+				"dist/types-ts4.5/*",
+				"dist/types-ts4.5/index.d.ts"
+			]
 		}
-	}
+	},
+	"version": "23.10.0"
 }