@atlaskit/mention 27.17.0 → 27.18.0

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

@@ -4,236 +4,27 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.MentionPickerWithAnalytics = exports.MentionPicker = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
+Object.defineProperty(exports, "MentionPicker", {
+  enumerable: true,
+  get: function get() {
+    return _MentionPicker.MentionPicker;
+  }
+});
+exports.default = exports.MentionPickerWithAnalytics = void 0;
 var _reactIntl = require("react-intl");
-var _compiled = require("@atlaskit/primitives/compiled");
 var _withAnalyticsEvents = _interopRequireDefault(require("@atlaskit/analytics-next/withAnalyticsEvents"));
-var _analytics = require("../../util/analytics");
-var _id = _interopRequireDefault(require("../../util/id"));
-var _logger = _interopRequireDefault(require("../../util/logger"));
-var _Popup = _interopRequireDefault(require("../Popup"));
-var _ResourcedMentionList = _interopRequireDefault(require("../ResourcedMentionList"));
-var _styles = require("./styles");
-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; })(); }
-/**
- * @class MentionPicker
- */
-var MentionPicker = exports.MentionPicker = /*#__PURE__*/function (_React$PureComponent) {
-  function MentionPicker(props) {
-    var _this;
-    (0, _classCallCheck2.default)(this, MentionPicker);
-    _this = _callSuper(this, MentionPicker, [props]);
-    (0, _defineProperty2.default)(_this, "selectNext", function () {
-      if (_this.mentionListRef) {
-        _this.mentionListRef.selectNext();
-      }
-    });
-    (0, _defineProperty2.default)(_this, "selectPrevious", function () {
-      if (_this.mentionListRef) {
-        _this.mentionListRef.selectPrevious();
-      }
-    });
-    (0, _defineProperty2.default)(_this, "selectIndex", function (index, callback) {
-      if (_this.mentionListRef) {
-        _this.mentionListRef.selectIndex(index, callback);
-      }
-    });
-    (0, _defineProperty2.default)(_this, "selectId", function (id, callback) {
-      if (_this.mentionListRef) {
-        _this.mentionListRef.selectId(id, callback);
-      }
-    });
-    (0, _defineProperty2.default)(_this, "chooseCurrentSelection", function () {
-      if (_this.mentionListRef) {
-        _this.mentionListRef.chooseCurrentSelection();
-      }
-    });
-    (0, _defineProperty2.default)(_this, "mentionsCount", function () {
-      if (_this.mentionListRef) {
-        return _this.mentionListRef.mentionsCount();
-      }
-      return 0;
-    });
-    /**
-     * Called after the 'visible' state is changed to decide whether the onOpen or onClose
-     * handlers should be called.
-     *
-     * It should be noted that the visible state of the component is not considered in
-     * this function. Instead the old state and new state should be passed as parameters.
-     */
-    (0, _defineProperty2.default)(_this, "onFilterVisibilityChange", function (oldVisibility, newVisibility) {
-      if (oldVisibility !== newVisibility) {
-        if (newVisibility) {
-          if (_this.props.onOpen) {
-            _this.props.onOpen();
-          }
-        } else {
-          if (_this.props.onClose) {
-            _this.props.onClose();
-          }
-        }
-      }
-    });
-    // internal, used for callbacks
-    (0, _defineProperty2.default)(_this, "filterChange", function (mentions, query, stats) {
-      (0, _logger.default)('ak-mention-picker.filterChange', mentions.length);
-      var wasVisible = _this.state.visible;
-      var visible = mentions.length > 0;
-      _this.setState({
-        visible: visible
-      });
-      _this.onFilterVisibilityChange(wasVisible, visible);
-      (0, _analytics.fireAnalyticsMentionTypeaheadEvent)(_this.props)('rendered', stats && stats.duration, mentions.map(function (mention) {
-        return mention.id;
-      }), query);
-    });
-    (0, _defineProperty2.default)(_this, "filterError", function (error) {
-      (0, _logger.default)('ak-mention-picker.filterError', error);
-      var wasVisible = _this.state.visible;
-      _this.setState({
-        visible: true,
-        info: undefined
-      });
-      _this.onFilterVisibilityChange(wasVisible, true);
-    });
-    (0, _defineProperty2.default)(_this, "filterInfo", function (info) {
-      (0, _logger.default)('ak-mention-picker.filterInfo', info);
-      _this.setState({
-        info: info
-      });
-    });
-    (0, _defineProperty2.default)(_this, "handleMentionListRef", function (ref) {
-      _this.mentionListRef = ref;
-    });
-    _this.subscriberKey = (0, _id.default)('ak-mention-picker');
-    _this.state = {
-      visible: false
-    };
-    _this.applyPropChanges({}, props);
-    return _this;
-  }
-  (0, _inherits2.default)(MentionPicker, _React$PureComponent);
-  return (0, _createClass2.default)(MentionPicker, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.subscribeResourceProvider(this.props.resourceProvider);
-    }
-  }, {
-    key: "UNSAFE_componentWillReceiveProps",
-    value: function UNSAFE_componentWillReceiveProps(nextProps) {
-      this.applyPropChanges(this.props, nextProps);
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      this.unsubscribeResourceProvider(this.props.resourceProvider);
-    }
-  }, {
-    key: "applyPropChanges",
-    value:
-    // Internal
-    function applyPropChanges(prevProps, nextProps) {
-      var oldResourceProvider = prevProps.resourceProvider;
-      var newResourceProvider = nextProps.resourceProvider;
-      var resourceProviderChanged = oldResourceProvider !== newResourceProvider;
+var _MentionPicker = require("./MentionPicker");
+/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required -- VOLTC-139 tracks removal of these deprecated re-export shims. */
 
-      // resource provider
-      if (resourceProviderChanged) {
-        this.unsubscribeResourceProvider(oldResourceProvider);
-        this.subscribeResourceProvider(newResourceProvider);
-      }
-    }
-  }, {
-    key: "subscribeResourceProvider",
-    value: function subscribeResourceProvider(resourceProvider) {
-      if (resourceProvider) {
-        resourceProvider.subscribe(this.subscriberKey, this.filterChange, this.filterError, this.filterInfo, undefined);
-      }
-    }
-  }, {
-    key: "unsubscribeResourceProvider",
-    value: function unsubscribeResourceProvider(resourceProvider) {
-      if (resourceProvider) {
-        resourceProvider.unsubscribe(this.subscriberKey);
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-        resourceProvider = _this$props.resourceProvider,
-        presenceProvider = _this$props.presenceProvider,
-        onSelection = _this$props.onSelection,
-        query = _this$props.query,
-        target = _this$props.target,
-        position = _this$props.position,
-        zIndex = _this$props.zIndex,
-        offsetX = _this$props.offsetX,
-        offsetY = _this$props.offsetY,
-        intl = _this$props.intl;
-      var _this$state = this.state,
-        visible = _this$state.visible,
-        info = _this$state.info;
-      var resourceMentionList = /*#__PURE__*/_react.default.createElement(_ResourcedMentionList.default, {
-        resourceProvider: resourceProvider,
-        presenceProvider: presenceProvider,
-        onSelection: onSelection,
-        query: query,
-        ref: this.handleMentionListRef
-      });
-      var infoContent = info && !visible ? /*#__PURE__*/_react.default.createElement(_styles.MentionPickerInfoStyle, null, /*#__PURE__*/_react.default.createElement(_compiled.Text, {
-        as: "p"
-      }, info)) : null;
-      var content;
-      if (position) {
-        (0, _logger.default)('target, position', target, position);
-        if (target) {
-          content = /*#__PURE__*/_react.default.createElement(_Popup.default, {
-            target: target,
-            relativePosition: position,
-            zIndex: zIndex,
-            offsetX: offsetX,
-            offsetY: offsetY
-          }, /*#__PURE__*/_react.default.createElement(_reactIntl.IntlProvider, {
-            locale: (intl === null || intl === void 0 ? void 0 : intl.locale) || 'en'
-          }, /*#__PURE__*/_react.default.createElement("div", null, resourceMentionList, infoContent)));
-        } else {
-          // don't show if we have a position, but no target yet
-          content = null;
-        }
-      } else {
-        content = /*#__PURE__*/_react.default.createElement("div", null, resourceMentionList, infoContent);
-      }
-      return (
-        /*#__PURE__*/
-        /* old classnames are essential for Confluence tests */
-        _react.default.createElement(_styles.MentionPickerStyle
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-        , {
-          className: "ak-mention-picker",
-          visible: visible || info
-        }, content)
-      );
-    }
-  }]);
-}(_react.default.PureComponent);
-(0, _defineProperty2.default)(MentionPicker, "defaultProps", {
-  onSelection: function onSelection() {},
-  onOpen: function onOpen() {},
-  onClose: function onClose() {}
-});
-var MentionPickerWithIntl = (0, _reactIntl.injectIntl)(MentionPicker, {
+var MentionPickerWithIntl = (0, _reactIntl.injectIntl)(_MentionPicker.MentionPicker, {
   forwardRef: true
 });
-
-// @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 var MentionPickerWithAnalytics = exports.MentionPickerWithAnalytics = (0, _withAnalyticsEvents.default)({})(MentionPickerWithIntl);
-var _default = exports.default = MentionPickerWithAnalytics;
+
+// Merges with the `const` above so that `MentionPickerWithAnalytics` is usable in a type
+// position as the component instance type (e.g. for refs). Both halves of a declaration
+// merge must live in the same module, so this alias cannot be split out.
+var _default = exports.default = MentionPickerWithAnalytics;
+/**
+ * @deprecated Use `import { MentionPicker } from '@atlaskit/mention/mention-picker'` instead.
+ */

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

@@ -9,7 +9,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireDefault(require("react"));
 var _reactIntl = require("react-intl");
-var _i18n = require("../../util/i18n");
+var _getMessagesForLocale = require("../../util/get-messages-for-locale");
 var EMPTY = {};
 var useI18n = function useI18n(locale) {
   var _React$useState = _react.default.useState(EMPTY),
@@ -19,7 +19,7 @@ var useI18n = function useI18n(locale) {
   _react.default.useEffect(function () {
     var aborted = false;
     setMessages(EMPTY);
-    (0, _i18n.getMessagesForLocale)(locale).then(function (messages) {
+    (0, _getMessagesForLocale.getMessagesForLocale)(locale).then(function (messages) {
       if (!aborted) {
         setMessages(messages);
       }

package/dist/cjs/components/ResourcedMentionList/ResourcedMentionListWithoutAnalytics.js

@@ -0,0 +1,228 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ResourcedMentionListWithoutAnalytics = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _analytics = require("../../util/analytics");
+var _fireSliAnalyticsEvent = require("../../util/fire-sli-analytics-event");
+var _id = _interopRequireDefault(require("../../util/id"));
+var _logger = _interopRequireDefault(require("../../util/logger"));
+var _MentionList = _interopRequireDefault(require("../MentionList"));
+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; })(); }
+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; }
+function applyPresence(mentions, presences) {
+  var updatedMentions = [];
+  for (var i = 0; i < mentions.length; i++) {
+    // Shallow copy
+    var mention = _objectSpread({}, mentions[i]);
+    var presence = presences[mention.id];
+    if (presence) {
+      mention.presence = presence;
+    }
+    updatedMentions.push(mention);
+  }
+  return updatedMentions;
+}
+function extractPresences(mentions) {
+  var presences = {};
+  for (var i = 0; i < mentions.length; i++) {
+    var mention = mentions[i];
+    if (mention.presence) {
+      presences[mention.id] = mention.presence;
+    }
+  }
+  return presences;
+}
+var ResourcedMentionListWithoutAnalytics = exports.ResourcedMentionListWithoutAnalytics = /*#__PURE__*/function (_React$PureComponent) {
+  function ResourcedMentionListWithoutAnalytics(props) {
+    var _this;
+    (0, _classCallCheck2.default)(this, ResourcedMentionListWithoutAnalytics);
+    _this = _callSuper(this, ResourcedMentionListWithoutAnalytics, [props]);
+    // API
+    (0, _defineProperty2.default)(_this, "selectNext", function () {
+      if (_this.mentionListRef) {
+        _this.mentionListRef.selectNext();
+      }
+    });
+    (0, _defineProperty2.default)(_this, "selectPrevious", function () {
+      if (_this.mentionListRef) {
+        _this.mentionListRef.selectPrevious();
+      }
+    });
+    (0, _defineProperty2.default)(_this, "selectIndex", function (index, callback) {
+      if (_this.mentionListRef) {
+        _this.mentionListRef.selectIndex(index, callback);
+      }
+    });
+    (0, _defineProperty2.default)(_this, "selectId", function (id, callback) {
+      if (_this.mentionListRef) {
+        _this.mentionListRef.selectId(id, callback);
+      }
+    });
+    (0, _defineProperty2.default)(_this, "chooseCurrentSelection", function () {
+      if (_this.mentionListRef) {
+        _this.mentionListRef.chooseCurrentSelection();
+      }
+    });
+    (0, _defineProperty2.default)(_this, "mentionsCount", function () {
+      if (_this.mentionListRef) {
+        return _this.mentionListRef.mentionsCount();
+      }
+      return 0;
+    });
+    // internal, used for callbacks
+    (0, _defineProperty2.default)(_this, "filterChange", function (mentions) {
+      // Retain known presence
+      var currentPresences = extractPresences(_this.state.mentions);
+      _this.setState({
+        resourceError: undefined,
+        mentions: applyPresence(mentions, currentPresences)
+      });
+      _this.refreshPresences(mentions);
+    });
+    (0, _defineProperty2.default)(_this, "sendAnalytics", function (event, actionSubject, action) {
+      if (event === _analytics.SLI_EVENT_TYPE) {
+        (0, _fireSliAnalyticsEvent.fireSliAnalyticsEvent)(_this.props)(actionSubject, action);
+      }
+    });
+    (0, _defineProperty2.default)(_this, "filterError", function (error) {
+      (0, _logger.default)('ak-resourced-mentions-list._filterError', error);
+      _this.setState({
+        resourceError: error
+      });
+    });
+    (0, _defineProperty2.default)(_this, "presenceUpdate", function (presences) {
+      _this.setState({
+        mentions: applyPresence(_this.state.mentions, presences)
+      });
+    });
+    (0, _defineProperty2.default)(_this, "notifySelection", function (mention) {
+      _this.props.resourceProvider.recordMentionSelection(mention);
+      if (_this.props.onSelection) {
+        _this.props.onSelection(mention);
+      }
+    });
+    (0, _defineProperty2.default)(_this, "handleMentionListRef", function (ref) {
+      _this.mentionListRef = ref;
+    });
+    _this.subscriberKey = (0, _id.default)('ak-resourced-mention-list');
+    _this.state = {
+      resourceError: undefined,
+      mentions: []
+    };
+    _this.applyPropChanges({}, props);
+    return _this;
+  }
+  (0, _inherits2.default)(ResourcedMentionListWithoutAnalytics, _React$PureComponent);
+  return (0, _createClass2.default)(ResourcedMentionListWithoutAnalytics, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this.subscribeMentionProvider(this.props.resourceProvider);
+      this.subscribePresenceProvider(this.props.presenceProvider);
+    }
+  }, {
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(nextProps) {
+      this.applyPropChanges(this.props, nextProps);
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      this.unsubscribeMentionProvider(this.props.resourceProvider);
+      this.unsubscribePresenceProvider(this.props.presenceProvider);
+    }
+  }, {
+    key: "subscribeMentionProvider",
+    value:
+    // internal
+    function subscribeMentionProvider(mentionProvider) {
+      if (mentionProvider) {
+        mentionProvider.subscribe(this.subscriberKey, this.filterChange, this.filterError, undefined, undefined, this.sendAnalytics);
+      }
+    }
+  }, {
+    key: "subscribePresenceProvider",
+    value: function subscribePresenceProvider(presenceProvider) {
+      if (presenceProvider) {
+        presenceProvider.subscribe(this.subscriberKey, this.presenceUpdate);
+      }
+    }
+  }, {
+    key: "unsubscribeMentionProvider",
+    value: function unsubscribeMentionProvider(mentionProvider) {
+      if (mentionProvider) {
+        mentionProvider.unsubscribe(this.subscriberKey);
+      }
+    }
+  }, {
+    key: "unsubscribePresenceProvider",
+    value: function unsubscribePresenceProvider(presenceProvider) {
+      if (presenceProvider) {
+        presenceProvider.unsubscribe(this.subscriberKey);
+      }
+    }
+  }, {
+    key: "applyPropChanges",
+    value: function applyPropChanges(prevProps, nextProps) {
+      var oldResourceProvider = prevProps.resourceProvider;
+      var oldPresenceProvider = prevProps.presenceProvider;
+      var oldQuery = prevProps.query;
+      var newResourceProvider = nextProps.resourceProvider;
+      var newPresenceProvider = nextProps.presenceProvider;
+      var newQuery = nextProps.query;
+      var resourceProviderChanged = oldResourceProvider !== newResourceProvider;
+      var queryChanged = oldQuery !== newQuery;
+      var canFilter = !!(typeof newQuery === 'string' && newResourceProvider);
+      var shouldFilter = canFilter && (queryChanged || resourceProviderChanged);
+
+      // resource provider
+      if (resourceProviderChanged) {
+        this.unsubscribeMentionProvider(oldResourceProvider);
+        this.subscribeMentionProvider(newResourceProvider);
+      }
+
+      // presence provider
+      if (oldPresenceProvider !== newPresenceProvider) {
+        this.unsubscribePresenceProvider(oldPresenceProvider);
+        this.subscribePresenceProvider(newPresenceProvider);
+      }
+      if (shouldFilter) {
+        newResourceProvider.filter(newQuery);
+      }
+    }
+  }, {
+    key: "refreshPresences",
+    value: function refreshPresences(mentions) {
+      if (this.props.presenceProvider) {
+        var ids = mentions.map(function (mention) {
+          return mention.id;
+        });
+        this.props.presenceProvider.refreshPresence(ids);
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$state = this.state,
+        mentions = _this$state.mentions,
+        resourceError = _this$state.resourceError;
+      return /*#__PURE__*/_react.default.createElement(_MentionList.default, {
+        mentions: mentions,
+        resourceError: resourceError,
+        onSelection: this.notifySelection,
+        ref: this.handleMentionListRef
+      });
+    }
+  }]);
+}(_react.default.PureComponent);