@atlaskit/editor-core 153.1.5 → 157.0.0

package/dist/cjs/plugins/media/toolbar/commands.js

@@ -3,12 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.removeInlineCard = exports.changeInlineToMediaCard = void 0;
+exports.removeInlineCard = exports.changeMediaCardToInline = exports.changeInlineToMediaCard = void 0;
+
+var _prosemirrorModel = require("prosemirror-model");
 
 var _prosemirrorState = require("prosemirror-state");
 
 var _prosemirrorUtils = require("prosemirror-utils");
 
+var _analytics = require("../../analytics");
+
+var _utils = require("./utils");
+
 var changeInlineToMediaCard = function changeInlineToMediaCard(state, dispatch) {
   var _state$schema$nodes = state.schema.nodes,
       media = _state$schema$nodes.media,
@@ -36,6 +42,15 @@ var changeInlineToMediaCard = function changeInlineToMediaCard(state, dispatch)
   tr = (0, _prosemirrorUtils.safeInsert)(group, nodePos, true)(tr);
 
   if (dispatch) {
+    (0, _analytics.addAnalytics)(state, tr, {
+      action: _analytics.ACTION.CHANGED_TYPE,
+      actionSubject: _analytics.ACTION_SUBJECT.MEDIA,
+      eventType: _analytics.EVENT_TYPE.TRACK,
+      attributes: {
+        newType: _analytics.ACTION_SUBJECT_ID.MEDIA_GROUP,
+        previousType: _analytics.ACTION_SUBJECT_ID.MEDIA_INLINE
+      }
+    });
     dispatch(tr);
   }
 
@@ -44,6 +59,48 @@ var changeInlineToMediaCard = function changeInlineToMediaCard(state, dispatch)
 
 exports.changeInlineToMediaCard = changeInlineToMediaCard;
 
+var changeMediaCardToInline = function changeMediaCardToInline(state, dispatch) {
+  var _state$schema$nodes2 = state.schema.nodes,
+      media = _state$schema$nodes2.media,
+      mediaInline = _state$schema$nodes2.mediaInline,
+      paragraph = _state$schema$nodes2.paragraph;
+  var selectedNode = state.selection instanceof _prosemirrorState.NodeSelection && state.selection.node;
+
+  if (!selectedNode || !selectedNode.type === media) {
+    return false;
+  }
+
+  var mediaInlineNode = mediaInline.create({
+    id: selectedNode.attrs.id,
+    collection: selectedNode.attrs.collection
+  });
+  var space = state.schema.text(' ');
+
+  var content = _prosemirrorModel.Fragment.from([mediaInlineNode, space]);
+
+  var node = paragraph.createChecked({}, content);
+  var nodePos = state.tr.doc.resolve(state.selection.from).start() - 1;
+  var tr = (0, _utils.removeMediaGroupNode)(state);
+  tr = (0, _prosemirrorUtils.safeInsert)(node, nodePos, true)(tr);
+
+  if (dispatch) {
+    (0, _analytics.addAnalytics)(state, tr, {
+      action: _analytics.ACTION.CHANGED_TYPE,
+      actionSubject: _analytics.ACTION_SUBJECT.MEDIA,
+      eventType: _analytics.EVENT_TYPE.TRACK,
+      attributes: {
+        newType: _analytics.ACTION_SUBJECT_ID.MEDIA_INLINE,
+        previousType: _analytics.ACTION_SUBJECT_ID.MEDIA_GROUP
+      }
+    });
+    dispatch(tr);
+  }
+
+  return true;
+};
+
+exports.changeMediaCardToInline = changeMediaCardToInline;
+
 var removeInlineCard = function removeInlineCard(state, dispatch) {
   if ((0, _prosemirrorUtils.isNodeSelection)(state.selection)) {
     if (dispatch) {

package/dist/cjs/plugins/media/toolbar/index.js

@@ -55,8 +55,6 @@ var _filePreviewItem = require("./filePreviewItem");
 
 var _utils = require("./utils");
 
-var _prosemirrorModel = require("prosemirror-model");
-
 var _commands = require("./commands");
 
 var _styles = require("../nodeviews/styles");
@@ -83,49 +81,18 @@ var handleRemoveMediaGroup = function handleRemoveMediaGroup(state, dispatch) {
   return true;
 };
 
-var changeMediaCardToInline = function changeMediaCardToInline(state, dispatch) {
-  var _state$schema$nodes = state.schema.nodes,
-      media = _state$schema$nodes.media,
-      mediaInline = _state$schema$nodes.mediaInline,
-      paragraph = _state$schema$nodes.paragraph;
-  var selectedNode = state.selection instanceof _prosemirrorState.NodeSelection && state.selection.node;
-
-  if (!selectedNode || !selectedNode.type === media) {
-    return false;
-  }
-
-  var mediaInlineNode = mediaInline.create({
-    id: selectedNode.attrs.id,
-    collection: selectedNode.attrs.collection
-  });
-  var space = state.schema.text(' ');
-
-  var content = _prosemirrorModel.Fragment.from([mediaInlineNode, space]);
-
-  var node = paragraph.createChecked({}, content);
-  var nodePos = state.tr.doc.resolve(state.selection.from).start() - 1;
-  var tr = (0, _utils.removeMediaGroupNode)(state);
-  tr = (0, _prosemirrorUtils.safeInsert)(node, nodePos, true)(tr);
-
-  if (dispatch) {
-    dispatch(tr);
-  }
-
-  return true;
-};
-
 var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar(state, intl, mediaPluginState) {
   var mediaGroup = state.schema.nodes.mediaGroup;
   var items = [{
     id: 'editor.media.view.switcher',
     type: 'dropdown',
-    title: intl.formatMessage(_mediaUi.messages.displayThumbnail),
+    title: intl.formatMessage(_mediaUi.messages.changeView),
     options: [{
       id: 'editor.media.view.switcher.inline',
       title: intl.formatMessage(_messages2.messages.inline),
       selected: false,
       disabled: false,
-      onClick: changeMediaCardToInline,
+      onClick: _commands.changeMediaCardToInline,
       testId: 'inline-appearance'
     }, {
       id: 'editor.media.view.switcher.thumbnail',
@@ -183,7 +150,7 @@ var generateMediaInlineFloatingToolbar = function generateMediaInlineFloatingToo
   var items = [{
     id: 'editor.media.view.switcher',
     type: 'dropdown',
-    title: intl.formatMessage(_messages2.messages.inline),
+    title: intl.formatMessage(_mediaUi.messages.changeView),
     options: [{
       id: 'editor.media.view.switcher.inline',
       title: intl.formatMessage(_messages2.messages.inline),
@@ -341,11 +308,11 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
 
 var floatingToolbar = function floatingToolbar(state, intl) {
   var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  var _state$schema$nodes2 = state.schema.nodes,
-      media = _state$schema$nodes2.media,
-      mediaInline = _state$schema$nodes2.mediaInline,
-      mediaSingle = _state$schema$nodes2.mediaSingle,
-      mediaGroup = _state$schema$nodes2.mediaGroup;
+  var _state$schema$nodes = state.schema.nodes,
+      media = _state$schema$nodes.media,
+      mediaInline = _state$schema$nodes.mediaInline,
+      mediaSingle = _state$schema$nodes.mediaSingle,
+      mediaGroup = _state$schema$nodes.mediaGroup;
   var altTextValidator = options.altTextValidator,
       allowLinking = options.allowLinking,
       allowAltTextOnImages = options.allowAltTextOnImages,

package/dist/cjs/plugins/media/ui/Media/DropPlaceholder.js

@@ -21,6 +21,10 @@ var _documentFilled = _interopRequireDefault(require("@atlaskit/icon/glyph/docum
 
 var _adfSchema = require("@atlaskit/adf-schema");
 
+var _reactIntlNext = require("react-intl-next");
+
+var _dropPlaceholderMessages = require("./drop-placeholder-messages");
+
 var _media = require("../../nodeviews/mediaNodeView/media");
 
 var _templateObject, _templateObject2;
@@ -29,13 +33,21 @@ var IconWrapper = _styledComponents.default.div(_templateObject || (_templateObj
 
 var DropLine = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background: ", ";\n  border-radius: ", "px;\n  margin: 2px 0;\n  width: 100%;\n  height: 2px;\n"])), _colors.B200, (0, _constants.borderRadius)());
 
+var IconWrapperComponent = function IconWrapperComponent(props) {
+  var intl = props.intl;
+  var dropPlaceholderLabel = _dropPlaceholderMessages.dropPlaceholderMessages.dropPlaceholderLabel;
+  return /*#__PURE__*/_react.default.createElement(IconWrapper, null, /*#__PURE__*/_react.default.createElement(_documentFilled.default, {
+    label: intl.formatMessage(dropPlaceholderLabel),
+    size: "medium"
+  }));
+};
+
+var IntlIconWrapper = (0, _reactIntlNext.injectIntl)(IconWrapperComponent);
+
 var _default = function _default(_ref) {
   var _ref$type = _ref.type,
       type = _ref$type === void 0 ? 'group' : _ref$type;
-  return type === 'single' ? /*#__PURE__*/_react.default.createElement(DropLine, null) : /*#__PURE__*/_react.default.createElement(IconWrapper, null, /*#__PURE__*/_react.default.createElement(_documentFilled.default, {
-    label: "Document",
-    size: "medium"
-  }));
+  return type === 'single' ? /*#__PURE__*/_react.default.createElement(DropLine, null) : /*#__PURE__*/_react.default.createElement(IntlIconWrapper, null);
 };
 
 exports.default = _default;

package/dist/cjs/plugins/media/ui/Media/drop-placeholder-messages.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.dropPlaceholderMessages = void 0;
+
+var _reactIntlNext = require("react-intl-next");
+
+var dropPlaceholderMessages = (0, _reactIntlNext.defineMessages)({
+  dropPlaceholderLabel: {
+    id: 'fabric.editor.dropPlaceholderLabel',
+    defaultMessage: 'Document',
+    description: 'document label for an media icon'
+  }
+});
+exports.dropPlaceholderMessages = dropPlaceholderMessages;

package/dist/cjs/plugins/media/ui/ToolbarMedia/index.js

@@ -17,6 +17,10 @@ var _ToolbarButton = _interopRequireWildcard(require("../../../../ui/ToolbarButt
 
 var _WithPluginState = _interopRequireDefault(require("../../../../ui/WithPluginState"));
 
+var _toolbarMediaMessages = require("./toolbar-media-messages");
+
+var _reactIntlNext = require("react-intl-next");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -33,7 +37,8 @@ var ToolbarMedia = function ToolbarMedia(_ref) {
       eventDispatcher = _ref.eventDispatcher,
       pluginKey = _ref.pluginKey,
       isDisabled = _ref.isDisabled,
-      isReducedSpacing = _ref.isReducedSpacing;
+      isReducedSpacing = _ref.isReducedSpacing,
+      intl = _ref.intl;
   return /*#__PURE__*/_react.default.createElement(_WithPluginState.default, {
     editorView: editorView,
     eventDispatcher: eventDispatcher,
@@ -47,19 +52,21 @@ var ToolbarMedia = function ToolbarMedia(_ref) {
         return null;
       }
 
+      var toolbarMediaTitle = _toolbarMediaMessages.toolbarMediaMessages.toolbarMediaTitle;
       return /*#__PURE__*/_react.default.createElement(_ToolbarButton.default, {
         buttonId: _ToolbarButton.TOOLBAR_BUTTON.MEDIA,
         onClick: onClickMediaButton(mediaPlugin),
         disabled: isDisabled,
-        title: "Files & images",
+        title: intl.formatMessage(toolbarMediaTitle),
         spacing: isReducedSpacing ? 'none' : 'default',
         iconBefore: /*#__PURE__*/_react.default.createElement(_attachment.default, {
-          label: "Files & images"
+          label: intl.formatMessage(toolbarMediaTitle)
         })
       });
     }
   });
 };
 
-var _default = ToolbarMedia;
+var _default = (0, _reactIntlNext.injectIntl)(ToolbarMedia);
+
 exports.default = _default;

package/dist/cjs/plugins/media/ui/ToolbarMedia/toolbar-media-messages.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.toolbarMediaMessages = void 0;
+
+var _reactIntlNext = require("react-intl-next");
+
+var toolbarMediaMessages = (0, _reactIntlNext.defineMessages)({
+  toolbarMediaTitle: {
+    id: 'fabric.editor.toolbarMediaTitle',
+    defaultMessage: 'Files & images',
+    description: 'a label for an icon that describes files and images'
+  }
+});
+exports.toolbarMediaMessages = toolbarMediaMessages;

package/dist/cjs/plugins/media/utils/media-common.js

@@ -296,7 +296,8 @@ function canContainImage(element) {
 }
 /**
  * Given a html string, we attempt to hoist any nested `<img>` tags,
- * not wrapped by a `<div>` as ProseMirror no-op's on those scenarios.
+ * not directly wrapped by a `<div>` as ProseMirror no-op's
+ * on those scenarios.
  * @param html
  */
 
@@ -331,11 +332,11 @@ var unwrapNestedMediaElements = function unwrapNestedMediaElements(html) {
     if (isElementInvisible(mediaParent) || isElementInvisible(imageTag)) {
       mediaParent.removeChild(imageTag);
       return;
-    } // If its wrapped by a div we assume its safe to bypass.
-    // ProseMirror should handle this case properly.
+    } // If its wrapped by a valid container we assume its safe to bypass.
+    // ProseMirror should handle these cases properly.
 
 
-    if (mediaParent instanceof HTMLDivElement || mediaParent instanceof HTMLSpanElement && mediaParent.closest('[class*="emoji-common"]')) {
+    if (canContainImage(mediaParent) || mediaParent instanceof HTMLSpanElement && mediaParent.closest('[class*="emoji-common"]')) {
       return;
     } // Find the top most element that the parent has a valid container for the image.
     // Stop just before found the wrapper

package/dist/cjs/plugins/mentions/messages.js

@@ -12,6 +12,16 @@ var messages = (0, _reactIntlNext.defineMessages)({
     id: 'fabric.editor.inviteItem.title',
     defaultMessage: '{userRole, select, admin {Invite} trusted {Invite} other {Add}} teammate to {productName}',
     description: 'Title of the invite teammate item in typeahead plugin'
+  },
+  mentionsAddLabel: {
+    id: 'fabric.editor.mentionsAddLabel',
+    defaultMessage: 'add-icon',
+    description: 'icon label to describe adding a new mention'
+  },
+  mentionsIconLabel: {
+    id: 'fabric.editor.mentionsIconLabel',
+    defaultMessage: 'Mention',
+    description: 'icon label to describe the mention icon'
   }
 });
 exports.messages = messages;

package/dist/cjs/plugins/mentions/nodeviews/mention.js

@@ -2,8 +2,6 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
-var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -30,12 +28,6 @@ var _Mention = _interopRequireDefault(require("../ui/Mention"));
 
 var _nodeviews = require("../../../nodeviews");
 
-var _InlineNodeWrapper = _interopRequireWildcard(require("../../../ui/InlineNodeWrapper"));
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -53,10 +45,6 @@ var MentionNodeView = /*#__PURE__*/function (_ReactNodeView) {
   (0, _createClass2.default)(MentionNodeView, [{
     key: "createDomRef",
     value: function createDomRef() {
-      if (this.reactComponentProps.options && this.reactComponentProps.options.useInlineWrapper) {
-        return (0, _InlineNodeWrapper.createMobileInlineDomRef)();
-      }
-
       return (0, _get2.default)((0, _getPrototypeOf2.default)(MentionNodeView.prototype), "createDomRef", this).call(this);
     }
   }, {
@@ -68,9 +56,7 @@ var MentionNodeView = /*#__PURE__*/function (_ReactNodeView) {
           id = _this$node$attrs.id,
           text = _this$node$attrs.text,
           accessLevel = _this$node$attrs.accessLevel;
-      return /*#__PURE__*/_react.default.createElement(_InlineNodeWrapper.default, {
-        useInlineWrapper: options && options.useInlineWrapper
-      }, /*#__PURE__*/_react.default.createElement(_Mention.default, {
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Mention.default, {
         id: id,
         text: text,
         accessLevel: accessLevel,
@@ -85,9 +71,10 @@ exports.MentionNodeView = MentionNodeView;
 
 function mentionNodeView(portalProviderAPI, eventDispatcher, providerFactory, options) {
   return function (node, view, getPos) {
+    var hasIntlContext = true;
     return new MentionNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, {
       providerFactory: providerFactory,
       options: options
-    }).init();
+    }, undefined, undefined, undefined, hasIntlContext).init();
   };
 }

package/dist/cjs/plugins/mentions/pm-plugins/main.js

@@ -10,7 +10,7 @@ exports.setContext = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-var _prosemirrorState = require("prosemirror-state");
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 
 var _resource = require("@atlaskit/mention/resource");
 
@@ -68,7 +68,7 @@ function createMentionPlugin(dispatch, providerFactory, portalProviderAPI, event
     }
   };
 
-  return new _prosemirrorState.Plugin({
+  return new _safePlugin.SafePlugin({
     key: _key.mentionPluginKey,
     state: {
       init: function init() {

package/dist/cjs/plugins/mentions/ui/InviteItem/index.js

@@ -44,7 +44,8 @@ var InviteItem = function InviteItem(_ref) {
       onMouseEnter = _ref.onMouseEnter,
       onSelection = _ref.onSelection,
       selected = _ref.selected,
-      userRole = _ref.userRole;
+      userRole = _ref.userRole,
+      intl = _ref.intl;
   var onSelected = (0, _react.useCallback)(function (event) {
     if (leftClick(event) && onSelection) {
       event.preventDefault();
@@ -67,7 +68,7 @@ var InviteItem = function InviteItem(_ref) {
     onMouseEnter: onItemMouseEnter,
     "data-id": INVITE_ITEM_DESCRIPTION.id
   }, /*#__PURE__*/_react.default.createElement(_styles.RowStyle, null, /*#__PURE__*/_react.default.createElement(_styles.AvatarStyle, null, /*#__PURE__*/_react.default.createElement(_add.default, {
-    label: "add-icon",
+    label: intl.formatMessage(_messages.messages.mentionsAddLabel),
     primaryColor: _colors.N300
   })), /*#__PURE__*/_react.default.createElement(_styles.NameSectionStyle, null, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.messages.inviteItemTitle, {
     values: {
@@ -77,5 +78,6 @@ var InviteItem = function InviteItem(_ref) {
   })))));
 };
 
-var _default = InviteItem;
+var _default = (0, _reactIntlNext.injectIntl)(InviteItem);
+
 exports.default = _default;

package/dist/cjs/plugins/mentions/ui/ToolbarMention/index.js

@@ -33,6 +33,10 @@ var _analytics = require("../../../analytics");
 
 var _api = require("../../../type-ahead/api");
 
+var _reactIntlNext = require("react-intl-next");
+
+var _messages = require("../../messages");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -70,15 +74,16 @@ var ToolbarMention = /*#__PURE__*/function (_PureComponent) {
   (0, _createClass2.default)(ToolbarMention, [{
     key: "render",
     value: function render() {
+      var mentionStringTranslated = this.props.intl.formatMessage(_messages.messages.mentionsIconLabel);
       return /*#__PURE__*/_react.default.createElement(_ToolbarButton.default, {
         testId: this.props.testId,
         buttonId: _ToolbarButton.TOOLBAR_BUTTON.MENTION,
         spacing: "none",
         onClick: this.handleInsertMention,
         disabled: this.props.isDisabled,
-        title: "Mention @",
+        title: mentionStringTranslated + '@',
         iconBefore: /*#__PURE__*/_react.default.createElement(_mention.default, {
-          label: "Mention"
+          label: mentionStringTranslated
         })
       });
     }
@@ -86,4 +91,6 @@ var ToolbarMention = /*#__PURE__*/function (_PureComponent) {
   return ToolbarMention;
 }(_react.PureComponent);
 
-exports.default = ToolbarMention;
+var _default = (0, _reactIntlNext.injectIntl)(ToolbarMention);
+
+exports.default = _default;

package/dist/cjs/plugins/mobile-dimensions/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.MIN_TAP_SIZE_PX = void 0;
 
-var _prosemirrorState = require("prosemirror-state");
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 
 var _commands = require("./commands");
 
@@ -30,9 +30,23 @@ var getInitialState = function getInitialState() {
 
 var createPlugin = function createPlugin(dispatch) {
   var rafId;
-  return new _prosemirrorState.Plugin({
+  return new _safePlugin.SafePlugin({
     state: (0, _pluginFactory.createPluginState)(dispatch, getInitialState),
     key: _pluginFactory.mobileDimensionsPluginKey,
+    props: {
+      scrollThreshold: {
+        top: 12,
+        left: 0,
+        right: 0,
+        bottom: 12
+      },
+      scrollMargin: {
+        top: 12,
+        bottom: 12,
+        left: 0,
+        right: 0
+      }
+    },
     view: function view(editorView) {
       var handleResize = function handleResize() {
         if (rafId) {

package/dist/cjs/plugins/mobile-selection/content-in-selection.js

@@ -9,12 +9,12 @@ exports.contentInSelection = void 0;
 var contentInSelection = function contentInSelection(_ref) {
   var selection = _ref.selection,
       doc = _ref.doc;
-  var nodes = new Set();
-  var marks = new Set();
+  var nodes = new Array();
+  var marks = new Array();
   doc.nodesBetween(selection.from, selection.to, function (node) {
-    nodes.add(node.type.name);
+    nodes.push(node.type.name);
     node.marks.forEach(function (mark) {
-      return marks.add(mark.type.name);
+      return marks.push(mark.type.name);
     });
     return true;
   });

package/dist/cjs/plugins/mobile-selection/mobile-selection-plugin.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.selectionPluginKey = exports.mobileSelectionPlugin = exports.createProseMirrorPlugin = void 0;
 
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+
 var _prosemirrorState = require("prosemirror-state");
 
 var _prosemirrorUtils = require("prosemirror-utils");
@@ -15,7 +17,7 @@ var selectionPluginKey = new _prosemirrorState.PluginKey('mobile-selection');
 exports.selectionPluginKey = selectionPluginKey;
 
 var createProseMirrorPlugin = function createProseMirrorPlugin(dispatch) {
-  return new _prosemirrorState.Plugin({
+  return new _safePlugin.SafePlugin({
     view: function view(editorView) {
       var domAtPos = editorView.domAtPos.bind(editorView);
       return {

package/dist/cjs/plugins/panel/pm-plugins/main.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.createPlugin = void 0;
 
-var _prosemirrorState = require("prosemirror-state");
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 
 var _styles = require("@atlaskit/editor-common/styles");
 
@@ -18,7 +18,7 @@ var _utils = require("../../selection/utils");
 var createPlugin = function createPlugin(dispatch, providerFactory, pluginOptions) {
   var _pluginOptions$useLon = pluginOptions.useLongPressSelection,
       useLongPressSelection = _pluginOptions$useLon === void 0 ? false : _pluginOptions$useLon;
-  return new _prosemirrorState.Plugin({
+  return new _safePlugin.SafePlugin({
     key: _types.pluginKey,
     props: {
       nodeViews: {

package/dist/cjs/plugins/panel/toolbar.js

@@ -73,41 +73,47 @@ var panelIconMap = (_panelIconMap = {}, (0, _defineProperty2.default)(_panelIcon
 exports.panelIconMap = panelIconMap;
 
 var getToolbarItems = function getToolbarItems(formatMessage, panelNodeType, isCustomPanelEnabled, isCustomPanelEditable, providerFactory, activePanelType, activePanelColor, activePanelIcon) {
+  // TODO: ED-14403 investigate why these titles are not getting translated for the tooltips
   var items = [{
     id: 'editor.panel.info',
     type: 'button',
     icon: _info.default,
     onClick: (0, _actions.changePanelType)(_adfSchema.PanelType.INFO),
     selected: activePanelType === _adfSchema.PanelType.INFO,
-    title: formatMessage(_message.messages.info)
+    title: formatMessage(_message.messages.info),
+    tabIndex: null
   }, {
     id: 'editor.panel.note',
     type: 'button',
     icon: _note.default,
     onClick: (0, _actions.changePanelType)(_adfSchema.PanelType.NOTE),
     selected: activePanelType === _adfSchema.PanelType.NOTE,
-    title: formatMessage(_message.messages.note)
+    title: formatMessage(_message.messages.note),
+    tabIndex: null
   }, {
     id: 'editor.panel.success',
     type: 'button',
     icon: _success.default,
     onClick: (0, _actions.changePanelType)(_adfSchema.PanelType.SUCCESS),
     selected: activePanelType === _adfSchema.PanelType.SUCCESS,
-    title: formatMessage(_message.messages.success)
+    title: formatMessage(_message.messages.success),
+    tabIndex: null
   }, {
     id: 'editor.panel.warning',
     type: 'button',
     icon: _warning.default,
     onClick: (0, _actions.changePanelType)(_adfSchema.PanelType.WARNING),
     selected: activePanelType === _adfSchema.PanelType.WARNING,
-    title: formatMessage(_message.messages.warning)
+    title: formatMessage(_message.messages.warning),
+    tabIndex: null
   }, {
     id: 'editor.panel.error',
     type: 'button',
     icon: _error.default,
     onClick: (0, _actions.changePanelType)(_adfSchema.PanelType.ERROR),
     selected: activePanelType === _adfSchema.PanelType.ERROR,
-    title: formatMessage(_message.messages.error)
+    title: formatMessage(_message.messages.error),
+    tabIndex: null
   }];
 
   if (isCustomPanelEnabled) {
@@ -277,7 +283,8 @@ var getToolbarItems = function getToolbarItems(formatMessage, panelNodeType, isC
     onMouseLeave: (0, _decoration.hoverDecoration)(panelNodeType, false),
     onFocus: (0, _decoration.hoverDecoration)(panelNodeType, true),
     onBlur: (0, _decoration.hoverDecoration)(panelNodeType, false),
-    title: formatMessage(_messages.default.remove)
+    title: formatMessage(_messages.default.remove),
+    tabIndex: null
   });
   return items;
 };