@atlaskit/editor-core 153.1.4 → 156.0.0

package/dist/cjs/plugins/code-block/pm-plugins/main.js

@@ -9,6 +9,8 @@ exports.createPlugin = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+
 var _prosemirrorState = require("prosemirror-state");
 
 var _messages = require("@atlaskit/editor-common/messages");
@@ -37,10 +39,27 @@ var createPlugin = function createPlugin(_ref) {
   var _ref$useLongPressSele = _ref.useLongPressSelection,
       useLongPressSelection = _ref$useLongPressSele === void 0 ? false : _ref$useLongPressSele,
       getIntl = _ref.getIntl,
-      appearance = _ref.appearance;
+      appearance = _ref.appearance,
+      _ref$allowComposition = _ref.allowCompositionInputOverride,
+      allowCompositionInputOverride = _ref$allowComposition === void 0 ? false : _ref$allowComposition;
   var intl = getIntl();
   var codeBidiWarningLabel = intl.formatMessage(_messages.codeBidiWarningMessages.label);
-  return new _prosemirrorState.Plugin({
+  var handleDOMEvents = {}; // ME-1599: Composition on mobile was causing the DOM observer to mutate the code block
+  // incorrecly and lose content when pressing enter in the middle of a code block line.
+
+  if (allowCompositionInputOverride) {
+    handleDOMEvents.beforeinput = function (view, event) {
+      if (event.composed && // insertParagraph will be the input type when the enter key is pressed.
+      event.inputType === 'insertParagraph' && (0, _utils2.findCodeBlock)(view.state, view.state.selection)) {
+        event.preventDefault();
+        return true;
+      }
+
+      return false;
+    };
+  }
+
+  return new _safePlugin.SafePlugin({
     state: {
       init: function init(_, state) {
         var node = (0, _utils2.findCodeBlock)(state, state.selection);
@@ -96,7 +115,8 @@ var createPlugin = function createPlugin(_ref) {
         return !!(target.closest(".".concat(_classNames.codeBlockClassNames.gutter)) || target.classList.contains(_classNames.codeBlockClassNames.content));
       }, {
         useLongPressSelection: useLongPressSelection
-      })
+      }),
+      handleDOMEvents: handleDOMEvents
     }
   });
 };

package/dist/cjs/plugins/code-block/refresh-browser-selection.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _utils = require("@atlaskit/editor-common/utils");
 
 var _pluginKey = require("./plugin-key");
 
@@ -27,7 +27,7 @@ var refreshBrowserSelection = function refreshBrowserSelection() {
 var refreshBrowserSelectionOnChange = function refreshBrowserSelectionOnChange(transaction, editorState) {
   var _pluginKey$getState;
 
-  if (_editorCommon.browser.gecko && transaction.docChanged && // codeblockState.pos should be set if current selection is in a codeblock.
+  if (_utils.browser.gecko && transaction.docChanged && // codeblockState.pos should be set if current selection is in a codeblock.
   typeof ((_pluginKey$getState = _pluginKey.pluginKey.getState(editorState)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.pos) === 'number') {
     refreshBrowserSelection();
   }

package/dist/cjs/plugins/code-block/toolbar.js

@@ -95,7 +95,8 @@ var getToolbarConfig = function getToolbarConfig() {
       title: formatMessage(codeBlockState.contentCopied ? _messages.default.copiedToClipboard : _messages.default.copyToClipboard),
       onMouseLeave: _actions.resetCopiedState,
       hideTooltipOnClick: false,
-      disabled: codeBlockState.isNodeSelected
+      disabled: codeBlockState.isNodeSelected,
+      tabIndex: null
     }, separator];
     var deleteButton = {
       id: 'editor.codeBlock.delete',
@@ -107,7 +108,8 @@ var getToolbarConfig = function getToolbarConfig() {
       onFocus: (0, _decoration.hoverDecoration)(nodeType, true),
       onBlur: (0, _decoration.hoverDecoration)(nodeType, false),
       onClick: _actions.removeCodeBlock,
-      title: formatMessage(_messages.default.remove)
+      title: formatMessage(_messages.default.remove),
+      tabIndex: null
     };
     return {
       title: 'CodeBlock floating controls',

package/dist/cjs/plugins/collab-edit/actions.js

@@ -91,6 +91,16 @@ var applyRemoteSteps = function applyRemoteSteps(json, userIds, view, options) {
 
     var _json = (0, _slicedToArray2.default)(json, 1),
         firstStep = _json[0];
+    /*
+     * Persist marks across transactions. Fixes an issue where
+     * marks are lost if remote transactions are dispatched
+     * between a user creating the mark and typing.
+     */
+
+
+    if (state.tr.storedMarks) {
+      tr.setStoredMarks(state.tr.storedMarks);
+    }
     /**
      * If the cursor is a the same position as the first step in
      * the remote data, we need to manually set it back again

package/dist/cjs/plugins/collab-edit/analytics.js

@@ -11,11 +11,11 @@ var _featureFlagsContext = require("../feature-flags-context");
 
 var _documentLogger = require("../../utils/document-logger");
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _utils = require("@atlaskit/editor-common/utils");
 
 var addSynchronyErrorAnalytics = function addSynchronyErrorAnalytics(state, tr) {
   return function (error) {
-    var browserExtensions = (0, _editorCommon.sniffUserBrowserExtensions)({
+    var browserExtensions = (0, _utils.sniffUserBrowserExtensions)({
       extensions: ['grammarly']
     });
     var payload = {

package/dist/cjs/plugins/collab-edit/events/initialize.js

@@ -16,10 +16,21 @@ var _handlers = require("./handlers");
 var _pluginKey = require("../plugin-key");
 
 var initCollab = function initCollab(collabEditProvider, view) {
-  collabEditProvider.initialize(function () {
-    return view.state;
-  }, function (json) {
-    return _prosemirrorTransform.Step.fromJSON(view.state.schema, json);
+  if (collabEditProvider.initialize) {
+    collabEditProvider.initialize(function () {
+      return view.state;
+    }, function (json) {
+      return _prosemirrorTransform.Step.fromJSON(view.state.schema, json);
+    });
+  }
+};
+
+var initNewCollab = function initNewCollab(collabEditProvider, view, onSyncUpError) {
+  collabEditProvider.setup({
+    getState: function getState() {
+      return view.state;
+    },
+    onSyncUpError: onSyncUpError
   });
 };
 
@@ -40,12 +51,18 @@ var initialize = function initialize(_ref) {
 
     cleanup = (0, _handlers.subscribe)(view, provider, options, providerFactory); // Initialize provider
 
-    /**
-     * We only want to initialise once, if we reload/reconfigure this plugin
-     * We dont want to re-init collab, it would break existing sessions
-     */
+    if (options.useNativePlugin) {
+      // ED-13912 For NCS we don't want to use memoizeOne because it causes
+      // infinite text while changing page-width
+      initNewCollab(provider, view, options.onSyncUpError);
+    } else {
+      /**
+       * We only want to initialise once, if we reload/reconfigure this plugin
+       * We dont want to re-init collab, it would break existing sessions
+       */
+      initCollabMemo(provider, view);
+    }
 
-    initCollabMemo(provider, view);
     return cleanup;
   };
 };

package/dist/cjs/plugins/collab-edit/index.js

@@ -5,12 +5,6 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "CollabProvider", {
-  enumerable: true,
-  get: function get() {
-    return _provider.CollabProvider;
-  }
-});
 exports.default = void 0;
 Object.defineProperty(exports, "pluginKey", {
   enumerable: true,
@@ -29,12 +23,12 @@ var _prosemirrorCollab = require("prosemirror-collab");
 
 var _plugin = require("./plugin");
 
-var _provider = require("./provider");
-
 var _sendTransaction = require("./events/send-transaction");
 
 var _analytics = require("./analytics");
 
+var _nativeCollabProviderPlugin = require("./native-collab-provider-plugin");
+
 var providerBuilder = function providerBuilder(collabEditProviderPromise) {
   return /*#__PURE__*/function () {
     var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(codeToExecute, onError) {
@@ -109,6 +103,13 @@ var collabEditPlugin = function collabEditPlugin(options) {
             clientID: userId
           });
         }
+      }, {
+        name: 'nativeCollabProviderPlugin',
+        plugin: function plugin() {
+          return (0, _nativeCollabProviderPlugin.nativeCollabProviderPlugin)({
+            providerPromise: collabEditProviderPromise
+          });
+        }
       }] : []), [{
         name: 'collab',
         plugin: function plugin(_ref3) {

package/dist/cjs/plugins/collab-edit/native-collab-provider-plugin.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.nativeCollabProviderPlugin = exports.getCollabProvider = void 0;
+
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+
+var _prosemirrorState = require("prosemirror-state");
+
+var nativeCollabProviderPluginKey = new _prosemirrorState.PluginKey('nativeCollabProviderPlugin');
+
+var nativeCollabProviderPlugin = function nativeCollabProviderPlugin(_ref) {
+  var providerPromise = _ref.providerPromise;
+  return new _safePlugin.SafePlugin({
+    key: nativeCollabProviderPluginKey,
+    state: {
+      init: function init() {
+        return null;
+      },
+      apply: function apply(tr, currentPluginState) {
+        var provider = tr.getMeta(nativeCollabProviderPluginKey);
+        return provider ? provider : currentPluginState;
+      }
+    },
+    view: function view(editorView) {
+      providerPromise.then(function (provider) {
+        var dispatch = editorView.dispatch,
+            state = editorView.state;
+        var tr = state.tr;
+        tr.setMeta(nativeCollabProviderPluginKey, provider);
+        dispatch(tr);
+      });
+      return {};
+    }
+  });
+};
+
+exports.nativeCollabProviderPlugin = nativeCollabProviderPlugin;
+
+var getCollabProvider = function getCollabProvider(editorState) {
+  return nativeCollabProviderPluginKey.getState(editorState);
+};
+
+exports.getCollabProvider = getCollabProvider;

package/dist/cjs/plugins/collab-edit/plugin.js

@@ -17,7 +17,7 @@ Object.defineProperty(exports, "pluginKey", {
   }
 });
 
-var _prosemirrorState = require("prosemirror-state");
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 
 var _initialize = require("./events/initialize");
 
@@ -27,8 +27,13 @@ var _pluginKey = require("./plugin-key");
 
 var _analytics = require("./analytics");
 
+var _fireAnalyticsEvent = require("../analytics/fire-analytics-event");
+
+var _analytics2 = require("../analytics");
+
 var createPlugin = function createPlugin(dispatch, providerFactory, collabProviderCallback, options) {
-  return new _prosemirrorState.Plugin({
+  var fireAnalyticsCallback = (0, _fireAnalyticsEvent.fireAnalyticsEvent)(options === null || options === void 0 ? void 0 : options.createAnalyticsEvent);
+  return new _safePlugin.SafePlugin({
     key: _pluginKey.pluginKey,
     state: {
       init: function init(config) {
@@ -63,6 +68,19 @@ var createPlugin = function createPlugin(dispatch, providerFactory, collabProvid
     },
     view: function view(_view) {
       var addErrorAnalytics = (0, _analytics.addSynchronyErrorAnalytics)(_view.state, _view.state.tr);
+
+      var onSyncUpError = function onSyncUpError(attributes) {
+        fireAnalyticsCallback({
+          payload: {
+            action: _analytics2.ACTION.NEW_COLLAB_SYNC_UP_ERROR_NO_STEPS,
+            actionSubject: _analytics2.ACTION_SUBJECT.EDITOR,
+            eventType: _analytics2.EVENT_TYPE.OPERATIONAL,
+            attributes: attributes
+          }
+        });
+      };
+
+      options.onSyncUpError = onSyncUpError;
       var cleanup = collabProviderCallback((0, _initialize.initialize)({
         view: _view,
         options: options,

package/dist/cjs/plugins/collab-edit/provider/index.js

@@ -3,12 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "CollabProvider", {
-  enumerable: true,
-  get: function get() {
-    return _collabProvider.CollabProvider;
-  }
-});
 Object.defineProperty(exports, "PubSubSpecialEventType", {
   enumerable: true,
   get: function get() {
@@ -16,6 +10,4 @@ Object.defineProperty(exports, "PubSubSpecialEventType", {
   }
 });
 
-var _types = require("./types");
-
-var _collabProvider = require("./collab-provider");
+var _types = require("./types");

package/dist/cjs/plugins/collab-edit/utils.js

@@ -19,9 +19,9 @@ var themeColors = _interopRequireWildcard(require("@atlaskit/theme/colors"));
 
 var _adfSchema = require("@atlaskit/adf-schema");
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _utils = require("@atlaskit/editor-common/utils");
 
-var _utils = require("../analytics/utils");
+var _utils2 = require("../analytics/utils");
 
 var _types = require("../analytics/types");
 
@@ -87,7 +87,7 @@ var createTelepointers = function createTelepointers(from, to, sessionId, isSele
   }
 
   var cursor = document.createElement('span');
-  cursor.textContent = _editorCommon.ZERO_WIDTH_SPACE;
+  cursor.textContent = _utils.ZERO_WIDTH_SPACE;
   cursor.className = "telepointer color-".concat(color, " telepointer-selection-badge");
   cursor.style.cssText = "".concat(style({
     color: avatarColor.color.solid
@@ -157,7 +157,7 @@ var scrollToCollabCursor = function scrollToCollabCursor(editorView, participant
       eventType: _types.EVENT_TYPE.TRACK
     };
     tr.setSelection(_prosemirrorState.Selection.near(tr.doc.resolve(selectedUser.cursorPos)));
-    tr = (0, _utils.addAnalytics)(state, tr, analyticsPayload);
+    tr = (0, _utils2.addAnalytics)(state, tr, analyticsPayload);
     tr.scrollIntoView();
     editorView.dispatch(tr);
 

package/dist/cjs/plugins/context-panel/index.js

@@ -11,6 +11,8 @@ exports.pluginKey = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+
 var _prosemirrorState = require("prosemirror-state");
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -25,7 +27,7 @@ function getPluginState(state) {
 }
 
 function contextPanelPluginFactory(contextPanels, dispatch) {
-  return new _prosemirrorState.Plugin({
+  return new _safePlugin.SafePlugin({
     key: pluginKey,
     state: {
       init: function init(_config, state) {

package/dist/cjs/plugins/custom-autoformat/index.js

@@ -13,7 +13,7 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-var _prosemirrorState = require("prosemirror-state");
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 
 var _prosemirrorKeymap = require("prosemirror-keymap");
 
@@ -32,7 +32,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 var createPMPlugin = function createPMPlugin(_ref) {
   var providerFactory = _ref.providerFactory;
   var rules = [];
-  return new _prosemirrorState.Plugin({
+  return new _safePlugin.SafePlugin({
     state: {
       init: function init() {
         return {

package/dist/cjs/plugins/date/actions.js

@@ -9,7 +9,7 @@ var _prosemirrorState = require("prosemirror-state");
 
 var _prosemirrorModel = require("prosemirror-model");
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _utils = require("@atlaskit/editor-common/utils");
 
 var _pluginKey = require("./pm-plugins/plugin-key");
 
@@ -22,7 +22,7 @@ var _prosemirrorUtils = require("prosemirror-utils");
 var createDate = function createDate(isQuickInsertAction) {
   return function (insert, state) {
     var dateNode = state.schema.nodes.date.createChecked({
-      timestamp: (0, _editorCommon.todayTimestampInUTC)()
+      timestamp: (0, _utils.todayTimestampInUTC)()
     });
     var space = state.schema.text(' ');
     var tr = insert(_prosemirrorModel.Fragment.from([dateNode, space]), {
@@ -101,7 +101,7 @@ var insertDate = function insertDate(date, inputMethod, commitMethod) {
     if (date) {
       timestamp = Date.UTC(date.year, date.month - 1, date.day).toString();
     } else {
-      timestamp = (0, _editorCommon.todayTimestampInUTC)();
+      timestamp = (0, _utils.todayTimestampInUTC)();
     }
 
     var tr = state.tr;

package/dist/cjs/plugins/date/nodeviews/date.js

@@ -23,9 +23,11 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _react = _interopRequireDefault(require("react"));
 
+var _styles = require("@atlaskit/editor-common/styles");
+
 var _reactIntlNext = require("react-intl-next");
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _utils = require("@atlaskit/editor-common/utils");
 
 var _date = require("@atlaskit/date");
 
@@ -76,14 +78,14 @@ var DateNodeView = /*#__PURE__*/function (_React$Component) {
       var $nodePos = typeof getPos === 'function' ? doc.resolve(getPos()) : selection.$from;
       var parent = $nodePos.parent;
       var withinIncompleteTask = parent.type === schema.nodes.taskItem && parent.attrs.state !== 'DONE';
-      var color = withinIncompleteTask && (0, _editorCommon.isPastDate)(timestamp) ? 'red' : undefined;
+      var color = withinIncompleteTask && (0, _utils.isPastDate)(timestamp) ? 'red' : undefined;
       return /*#__PURE__*/_react.default.createElement("span", {
-        className: _editorCommon.DateSharedCssClassName.DATE_WRAPPER,
+        className: _styles.DateSharedCssClassName.DATE_WRAPPER,
         onClick: this.handleClick
       }, /*#__PURE__*/_react.default.createElement(_date.Date, {
         color: color,
         value: timestamp
-      }, withinIncompleteTask ? (0, _editorCommon.timestampToTaskContext)(timestamp, intl) : (0, _editorCommon.timestampToString)(timestamp, intl)));
+      }, withinIncompleteTask ? (0, _utils.timestampToTaskContext)(timestamp, intl) : (0, _utils.timestampToString)(timestamp, intl)));
     }
   }]);
   return DateNodeView;

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

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getPluginState = exports.default = void 0;
 
-var _prosemirrorState = require("prosemirror-state");
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 
 var _date = _interopRequireDefault(require("../nodeviews/date"));
 
@@ -39,7 +39,7 @@ var createPlugin = function createPlugin(_ref) {
     focusDateInput: false
   };
   var hasIntlContext = true;
-  return new _prosemirrorState.Plugin({
+  return new _safePlugin.SafePlugin({
     state: createPluginState(dispatch, newPluginState),
     key: _pluginKey.pluginKey,
     props: {

package/dist/cjs/plugins/date/styles.js

@@ -11,11 +11,11 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 
 var _styledComponents = require("styled-components");
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _styles = require("@atlaskit/editor-common/styles");
 
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
 var _templateObject;
 
-var dateStyles = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    .", " {\n      line-height: initial;\n      cursor: pointer;\n    }\n\n    &.", " {\n      .", " > span {\n        ", "\n      }\n    }\n  }\n\n  .danger {\n    .", ".", "\n      .", "\n      > span {\n      box-shadow: 0 0 0 ", "px ", ";\n    }\n  }\n"])), _editorCommon.DateSharedCssClassName.DATE_CONTAINER, _editorCommon.DateSharedCssClassName.DATE_WRAPPER, _editorSharedStyles.akEditorSelectedNodeClassName, _editorCommon.DateSharedCssClassName.DATE_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _editorCommon.DateSharedCssClassName.DATE_CONTAINER, _editorSharedStyles.akEditorSelectedNodeClassName, _editorCommon.DateSharedCssClassName.DATE_WRAPPER, _editorSharedStyles.akEditorSelectedBorderSize, _editorSharedStyles.akEditorDeleteBorder);
+var dateStyles = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    .", " {\n      line-height: initial;\n      cursor: pointer;\n    }\n\n    &.", " {\n      .", " > span {\n        ", "\n      }\n    }\n  }\n\n  .danger {\n    .", ".", "\n      .", "\n      > span {\n      box-shadow: 0 0 0 ", "px ", ";\n    }\n  }\n"])), _styles.DateSharedCssClassName.DATE_CONTAINER, _styles.DateSharedCssClassName.DATE_WRAPPER, _editorSharedStyles.akEditorSelectedNodeClassName, _styles.DateSharedCssClassName.DATE_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _styles.DateSharedCssClassName.DATE_CONTAINER, _editorSharedStyles.akEditorSelectedNodeClassName, _styles.DateSharedCssClassName.DATE_WRAPPER, _editorSharedStyles.akEditorSelectedBorderSize, _editorSharedStyles.akEditorDeleteBorder);
 exports.dateStyles = dateStyles;

package/dist/cjs/plugins/date/ui/DatePicker/index.js

@@ -27,7 +27,9 @@ var _react = _interopRequireDefault(require("react"));
 
 var _reactDom = _interopRequireDefault(require("react-dom"));
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _ui = require("@atlaskit/editor-common/ui");
+
+var _utils = require("@atlaskit/editor-common/utils");
 
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
@@ -53,7 +55,7 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 
 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; } }
 
-var PopupWithListeners = (0, _withOuterListeners.default)(_editorCommon.Popup);
+var PopupWithListeners = (0, _withOuterListeners.default)(_ui.Popup);
 
 var PopupContentWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  padding: 2px;\n  border-radius: ", "px;\n  box-shadow: 0 4px 8px -2px ", ", 0 0 1px ", ";\n  background-color: ", ";\n"])), (0, _constants.borderRadius)(), _colors.N60A, _colors.N60A, _colors.N0);
 
@@ -111,7 +113,7 @@ var DatePicker = /*#__PURE__*/function (_React$Component) {
     if (timestamp) {
       // Warning: The 'Date' return type of timestampToUTCDate() is not a JS date, it's more similar
       // to the DateType type
-      var _timestampToUTCDate = (0, _editorCommon.timestampToUTCDate)(timestamp),
+      var _timestampToUTCDate = (0, _utils.timestampToUTCDate)(timestamp),
           day = _timestampToUTCDate.day,
           month = _timestampToUTCDate.month,
           year = _timestampToUTCDate.year;
@@ -122,7 +124,7 @@ var DatePicker = /*#__PURE__*/function (_React$Component) {
         year: year
       };
       _this.state = {
-        selected: [(0, _editorCommon.timestampToIsoFormat)(timestamp)],
+        selected: [(0, _utils.timestampToIsoFormat)(timestamp)],
         date: _date,
         latestValidDate: _date
       };

package/dist/cjs/plugins/editor-disabled/index.js

@@ -6,6 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.createPlugin = createPlugin;
 exports.pluginKey = exports.default = void 0;
 
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+
 var _prosemirrorState = require("prosemirror-state");
 
 var _pluginStateFactory = require("../../utils/plugin-state-factory");
@@ -28,7 +30,7 @@ won't re-render when it changes.
 
 
 function createPlugin(dispatch) {
-  return new _prosemirrorState.Plugin({
+  return new _safePlugin.SafePlugin({
     key: pluginKey,
     state: createPluginState(dispatch, {
       editorDisabled: false

package/dist/cjs/plugins/emoji/index.js

@@ -16,6 +16,8 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _react = _interopRequireDefault(require("react"));
 
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+
 var _prosemirrorState = require("prosemirror-state");
 
 var _adfSchema = require("@atlaskit/adf-schema");
@@ -321,7 +323,7 @@ function getEmojiPluginState(state) {
 }
 
 function emojiPluginFactory(dispatch, providerFactory, portalProviderAPI, eventDispatcher, options) {
-  return new _prosemirrorState.Plugin({
+  return new _safePlugin.SafePlugin({
     key: emojiPluginKey,
     state: {
       init: function init() {

package/dist/cjs/plugins/emoji/nodeviews/emoji-next.js

@@ -20,16 +20,12 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _prosemirrorModel = require("prosemirror-model");
 
-var _editorCommon = require("@atlaskit/editor-common");
-
-var _InlineNodeWrapper = require("../../../ui/InlineNodeWrapper");
+var _utils = require("@atlaskit/editor-common/utils");
 
 var EmojiNodeView = /*#__PURE__*/function () {
   function EmojiNodeView(node, _, context) {
     var _this = this,
-        _this$options,
-        _this$options2,
-        _this$options3;
+        _this$options;
 
     (0, _classCallCheck2.default)(this, EmojiNodeView);
     (0, _defineProperty2.default)(this, "hasProvider", false);
@@ -48,18 +44,11 @@ var EmojiNodeView = /*#__PURE__*/function () {
     this.providers = context.providerFactory;
     this.options = context.options;
     this.dom = EmojiNodeView.toDom(node);
-
-    if ((_this$options = this.options) !== null && _this$options !== void 0 && _this$options.useInlineWrapper) {
-      var dom = (0, _InlineNodeWrapper.createMobileInlineDomRef)();
-      dom.appendChild(this.dom);
-      this.dom = dom;
-    }
-
-    this.el = (_this$options2 = this.options) !== null && _this$options2 !== void 0 && _this$options2.useInlineWrapper ? this.dom.firstElementChild : this.dom;
+    this.el = this.dom;
     this.providers.subscribe('emojiProvider', this.subscribe);
 
-    if ((_this$options3 = this.options) !== null && _this$options3 !== void 0 && _this$options3.allowZeroWidthSpaceAfter) {
-      this.el.after(document.createTextNode(_editorCommon.ZERO_WIDTH_SPACE));
+    if ((_this$options = this.options) !== null && _this$options !== void 0 && _this$options.allowZeroWidthSpaceAfter) {
+      this.el.after(document.createTextNode(_utils.ZERO_WIDTH_SPACE));
     }
 
     this.update(this.node, null);