@atlaskit/editor-core 153.1.4 → 153.1.5

package/dist/cjs/plugins/card/ui/ResizableEmbedCard.js

@@ -27,7 +27,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _prosemirrorUtils = require("prosemirror-utils");
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _ui = require("@atlaskit/editor-common/ui");
 
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
@@ -71,7 +71,7 @@ var ResizableEmbedCard = /*#__PURE__*/function (_React$Component) {
       var _this$props = _this.props,
           layout = _this$props.layout,
           state = _this$props.view.state;
-      var newPct = (0, _editorCommon.calcPctFromPx)(newWidth, _this.props.lineLength) * 100;
+      var newPct = (0, _ui.calcPctFromPx)(newWidth, _this.props.lineLength) * 100;
 
       _this.setState({
         resizedPctWidth: newPct
@@ -108,7 +108,7 @@ var ResizableEmbedCard = /*#__PURE__*/function (_React$Component) {
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcColumnLeftOffset", function () {
       var offsetLeft = _this.state.offsetLeft;
-      return _this.insideInlineLike ? (0, _editorCommon.calcColumnsFromPx)(offsetLeft, _this.props.lineLength, _this.props.gridSize) : 0;
+      return _this.insideInlineLike ? (0, _ui.calcColumnsFromPx)(offsetLeft, _this.props.lineLength, _this.props.gridSize) : 0;
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcPxWidth", function (useLayout) {
       var _this$props2 = _this.props,
@@ -156,7 +156,7 @@ var ResizableEmbedCard = /*#__PURE__*/function (_React$Component) {
           layout = _this$props3.layout,
           lineLength = _this$props3.lineLength,
           gridSize = _this$props3.gridSize;
-      var columns = (0, _editorCommon.calcColumnsFromPx)(snapWidth, lineLength, gridSize);
+      var columns = (0, _ui.calcColumnsFromPx)(snapWidth, lineLength, gridSize);
       var columnWidth = Math.round(columns);
       var highlight = [];
 
@@ -189,7 +189,7 @@ var ResizableEmbedCard = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "wrappedLayout",
     get: function get() {
-      return _editorCommon.wrappedLayouts.indexOf(this.props.layout) > -1;
+      return _ui.wrappedLayouts.indexOf(this.props.layout) > -1;
     }
   }, {
     key: "UNSAFE_componentWillReceiveProps",
@@ -208,7 +208,7 @@ var ResizableEmbedCard = /*#__PURE__*/function (_React$Component) {
     value: function checkLayout(oldLayout, newLayout) {
       var resizedPctWidth = this.state.resizedPctWidth;
 
-      if (_editorCommon.wrappedLayouts.indexOf(oldLayout) > -1 && newLayout === 'center' && resizedPctWidth) {
+      if (_ui.wrappedLayouts.indexOf(oldLayout) > -1 && newLayout === 'center' && resizedPctWidth) {
         var layout = this.calcUnwrappedLayout(resizedPctWidth, this.calcPxWidth(newLayout));
         this.props.updateSize(resizedPctWidth, layout);
       }
@@ -274,12 +274,12 @@ var ResizableEmbedCard = /*#__PURE__*/function (_React$Component) {
       var snapTargets = [];
 
       for (var i = 0; i < this.gridWidth; i++) {
-        snapTargets.push((0, _editorCommon.calcPxFromColumns)(i, lineLength, this.gridWidth) - offsetLeft);
+        snapTargets.push((0, _ui.calcPxFromColumns)(i, lineLength, this.gridWidth) - offsetLeft);
       } // full width
 
 
       snapTargets.push(lineLength - offsetLeft);
-      var minimumWidth = (0, _editorCommon.calcPxFromColumns)(this.wrappedLayout || this.insideInlineLike ? 1 : 2, lineLength, this.props.gridSize);
+      var minimumWidth = (0, _ui.calcPxFromColumns)(this.wrappedLayout || this.insideInlineLike ? 1 : 2, lineLength, this.props.gridSize);
       var snapPoints = snapTargets.filter(function (width) {
         return width >= minimumWidth;
       });

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

@@ -7,6 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _react = _interopRequireDefault(require("react"));
 
 var _adfSchema = require("@atlaskit/adf-schema");
@@ -27,6 +29,10 @@ var _messages = require("../block-type/messages");
 
 var _refreshBrowserSelection = _interopRequireDefault(require("./refresh-browser-selection"));
 
+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; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 var codeBlockPlugin = function codeBlockPlugin(options) {
   return {
     name: 'codeBlock',
@@ -41,11 +47,10 @@ var codeBlockPlugin = function codeBlockPlugin(options) {
         name: 'codeBlock',
         plugin: function plugin(_ref) {
           var getIntl = _ref.getIntl;
-          return (0, _main.createPlugin)({
-            useLongPressSelection: options.useLongPressSelection,
+          return (0, _main.createPlugin)(_objectSpread(_objectSpread({}, options), {}, {
             getIntl: getIntl,
             appearance: options.appearance
-          });
+          }));
         }
       }, {
         name: 'codeBlockIDEKeyBindings',

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

@@ -37,9 +37,26 @@ 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);
+  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 _prosemirrorState.Plugin({
     state: {
       init: function init(_, state) {
@@ -96,7 +113,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/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

@@ -40,12 +40,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
+      initCollab(provider, view);
+    } 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/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/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/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/emoji/nodeviews/emoji-next.js

@@ -20,7 +20,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _prosemirrorModel = require("prosemirror-model");
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _utils = require("@atlaskit/editor-common/utils");
 
 var _InlineNodeWrapper = require("../../../ui/InlineNodeWrapper");
 
@@ -59,7 +59,7 @@ var EmojiNodeView = /*#__PURE__*/function () {
     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));
+      this.el.after(document.createTextNode(_utils.ZERO_WIDTH_SPACE));
     }
 
     this.update(this.node, null);

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

@@ -24,7 +24,7 @@ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/ge
 
 var _react = _interopRequireDefault(require("react"));
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _utils = require("@atlaskit/editor-common/utils");
 
 var _Emoji = _interopRequireDefault(require("../ui/Emoji"));
 
@@ -75,7 +75,7 @@ var EmojiNodeView = /*#__PURE__*/function (_ReactNodeView) {
         id: id,
         shortName: shortName,
         fallback: text
-      }), options && options.allowZeroWidthSpaceAfter && _editorCommon.ZERO_WIDTH_SPACE);
+      }), options && options.allowZeroWidthSpaceAfter && _utils.ZERO_WIDTH_SPACE);
     }
   }]);
   return EmojiNodeView;

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

@@ -15,13 +15,13 @@ var _colors = require("@atlaskit/theme/colors");
 
 var _constants = require("@atlaskit/theme/constants");
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _emoji = require("@atlaskit/editor-common/emoji");
 
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
 var _templateObject, _templateObject2;
 
-var emojiStyles = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    display: inline-block;\n\n    .", " {\n      cursor: pointer;\n\n      &.", " > span {\n        /** needed for selection style to cover custom emoji image properly */\n        display: flex;\n      }\n    }\n\n    &.", " {\n      .", ",\n        .", "\n        > span {\n        border-radius: 2px;\n        ", "\n      }\n    }\n  }\n"])), _editorCommon.EmojiSharedCssClassName.EMOJI_CONTAINER, _editorCommon.EmojiSharedCssClassName.EMOJI_NODE, _editorCommon.EmojiSharedCssClassName.EMOJI_IMAGE, _editorSharedStyles.akEditorSelectedNodeClassName, _editorCommon.EmojiSharedCssClassName.EMOJI_SPRITE, _editorCommon.EmojiSharedCssClassName.EMOJI_IMAGE, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.Blanket, _editorSharedStyles.SelectionStyle.BoxShadow]));
+var emojiStyles = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    display: inline-block;\n\n    .", " {\n      cursor: pointer;\n\n      &.", " > span {\n        /** needed for selection style to cover custom emoji image properly */\n        display: flex;\n      }\n    }\n\n    &.", " {\n      .", ",\n        .", " {\n        border-radius: 2px;\n        ", "\n      }\n    }\n  }\n"])), _emoji.EmojiSharedCssClassName.EMOJI_CONTAINER, _emoji.EmojiSharedCssClassName.EMOJI_NODE, _emoji.EmojiSharedCssClassName.EMOJI_IMAGE, _editorSharedStyles.akEditorSelectedNodeClassName, _emoji.EmojiSharedCssClassName.EMOJI_SPRITE, _emoji.EmojiSharedCssClassName.EMOJI_IMAGE, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.Blanket, _editorSharedStyles.SelectionStyle.BoxShadow]));
 exports.emojiStyles = emojiStyles;
 var grid = (0, _constants.gridSize)() / 2;
 var fontSize = (0, _constants.fontSizeSmall)();

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

@@ -11,8 +11,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _styles = require("../../../../ui/styles");
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _emoji = require("@atlaskit/editor-common/emoji");
 
 function EmojiNode(props) {
-  return /*#__PURE__*/_react.default.createElement(_styles.ClickSelectWrapper, null, /*#__PURE__*/_react.default.createElement(_editorCommon.Emoji, props));
+  return /*#__PURE__*/_react.default.createElement(_styles.ClickSelectWrapper, null, /*#__PURE__*/_react.default.createElement(_emoji.Emoji, props));
 }

package/dist/cjs/plugins/expand/nodeviews/index.js

@@ -26,7 +26,7 @@ var _w3cKeyname = require("w3c-keyname");
 
 var _prosemirrorModel = require("prosemirror-model");
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _ui = require("@atlaskit/editor-common/ui");
 
 var _utils = require("../../../utils");
 
@@ -74,7 +74,7 @@ var toDOM = function toDOM(node, intl) {
     // prettier-ignore
     'class': _classNames.expandClassNames.titleInput,
     value: node.attrs.title,
-    placeholder: intl && intl.formatMessage(_editorCommon.expandMessages.expandPlaceholderText) || _editorCommon.expandMessages.expandPlaceholderText.defaultMessage,
+    placeholder: intl && intl.formatMessage(_ui.expandMessages.expandPlaceholderText) || _ui.expandMessages.expandPlaceholderText.defaultMessage,
     type: 'text'
   }]]], // prettier-ignore
   ['div', {

package/dist/cjs/plugins/expand/ui/ExpandIconButton.js

@@ -29,7 +29,7 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _customThemeButton = _interopRequireDefault(require("@atlaskit/button/custom-theme-button"));
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _ui = require("@atlaskit/editor-common/ui");
 
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
@@ -55,7 +55,7 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 var ExpandLayoutWrapperWithRef = /*#__PURE__*/(0, _react.forwardRef)(function WithRef(props, ref) {
   // @ts-ignore: incorrect innerRef typing
-  return /*#__PURE__*/_react.default.createElement(_editorCommon.ExpandLayoutWrapper, (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/_react.default.createElement(_ui.ExpandLayoutWrapper, (0, _extends2.default)({}, props, {
     innerRef: ref
   }));
 });
@@ -125,7 +125,7 @@ var ButtonWithoutTooltip = CustomButton;
 var ExpandIconButton = function ExpandIconButton(props) {
   var expanded = props.expanded,
       intl = props.intl;
-  var message = expanded ? _editorCommon.expandMessages.collapseNode : _editorCommon.expandMessages.expandNode;
+  var message = expanded ? _ui.expandMessages.collapseNode : _ui.expandMessages.expandNode;
   var label = intl && intl.formatMessage(message) || message.defaultMessage; // check to ensure device supports any-hover
 
   var supportsAnyHover = !!window.matchMedia ? window.matchMedia('(any-hover: hover)').matches !== window.matchMedia('(any-hover: none)').matches : false;
@@ -137,7 +137,7 @@ var ExpandIconButton = function ExpandIconButton(props) {
     }, props));
   }
 
-  return /*#__PURE__*/_react.default.createElement(_editorCommon.ExpandLayoutWrapper, null, /*#__PURE__*/_react.default.createElement(ButtonWithoutTooltip, (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement(_ui.ExpandLayoutWrapper, null, /*#__PURE__*/_react.default.createElement(ButtonWithoutTooltip, (0, _extends2.default)({
     label: label
   }, props)));
 };

package/dist/cjs/plugins/expand/ui/styles.js

@@ -17,7 +17,7 @@ var _constants = require("@atlaskit/theme/constants");
 
 var _colors = require("@atlaskit/theme/colors");
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _ui = require("@atlaskit/editor-common/ui");
 
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
@@ -57,7 +57,7 @@ var DANGER_STATE_BORDER_COLOR = (0, _components.themed)({
 var DANGER_STATE_BORDER_RADIUS = (0, _components.themed)({
   dark: '3px'
 });
-var expandStyles = (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  .", " > div {\n    display: flex;\n  }\n\n  .", " {\n    ", "\n    overflow: hidden;\n    cursor: pointer;\n    box-sizing: border-box;\n\n    td > & {\n      margin-top: 0;\n    }\n\n    .", " svg {\n      ", ";\n      transform: rotate(90deg);\n    }\n\n    &.", ":not(.danger) {\n      ", "\n\n      ::after {\n        // Custom background color and borders (for dark theme).\n        background-color: ", ";\n        border: ", ";\n        border-radius: ", ";\n      }\n    }\n\n    &.danger {\n      background: ", ";\n      border: ", ";\n      border-color: ", ";\n      border-radius: ", ";\n    }\n  }\n\n  .ProseMirror\n    > .", ",\n    .", "\n    > .", " {\n    margin-left: -", "px;\n    margin-right: -", "px;\n  }\n\n  .", " {\n    ", "\n    cursor: text;\n    padding-top: 0px;\n  }\n\n  .", " {\n    ", "\n  }\n\n  .", " {\n    ", ";\n    overflow: visible;\n  }\n\n  .", " {\n    background: ", ";\n    border-color: ", ";\n\n    .", " {\n      padding-top: ", "px;\n    }\n  }\n\n  .", " {\n    width: 100%;\n  }\n\n  .", ":(.", ") {\n    .expand-content-wrapper {\n      height: auto;\n    }\n  }\n\n  .", ":not(.", ") {\n    .ak-editor-expand__content {\n      position: absolute;\n      height: 1px;\n      width: 1px;\n      overflow: hidden;\n      clip: rect(1px, 1px, 1px, 1px);\n      white-space: nowrap;\n    }\n\n    .", " svg {\n      ", ";\n      transform: rotate(0deg);\n    }\n\n    &:not(.", "):not(.danger) {\n      background: transparent;\n      border-color: transparent;\n\n      &:hover {\n        border-color: ", ";\n        background: ", ";\n      }\n    }\n  }\n"])), _classNames.expandClassNames.icon, _classNames.expandClassNames.prefix, _editorCommon.sharedExpandStyles.ContainerStyles, _classNames.expandClassNames.iconContainer, EXPAND_ICON_COLOR, _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.Blanket, _editorSharedStyles.SelectionStyle.Border]), ACTIVE_STATE_BACKGROUND_COLOR, ACTIVE_STATE_BORDER, ACTIVE_STATE_BORDER_RADIUS, DANGER_STATE_BACKGROUND_COLOR, DANGER_STATE_BORDER, DANGER_STATE_BORDER_COLOR, DANGER_STATE_BORDER_RADIUS, _classNames.expandClassNames.type('expand'), _constants2.BreakoutCssClassName.BREAKOUT_MARK_DOM, _classNames.expandClassNames.type('expand'), _editorSharedStyles.akLayoutGutterOffset, _editorSharedStyles.akLayoutGutterOffset, _classNames.expandClassNames.content, _editorCommon.sharedExpandStyles.ContentStyles, _classNames.expandClassNames.titleInput, _editorCommon.sharedExpandStyles.TitleInputStyles, _classNames.expandClassNames.titleContainer, _editorCommon.sharedExpandStyles.TitleContainerStyles, _classNames.expandClassNames.expanded, EXPAND_SELECTED_BACKGROUND, (0, _components.themed)({
+var expandStyles = (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  .", " > div {\n    display: flex;\n  }\n\n  .", " {\n    ", "\n    overflow: hidden;\n    cursor: pointer;\n    box-sizing: border-box;\n\n    td > & {\n      margin-top: 0;\n    }\n\n    .", " svg {\n      ", ";\n      transform: rotate(90deg);\n    }\n\n    &.", ":not(.danger) {\n      ", "\n\n      ::after {\n        // Custom background color and borders (for dark theme).\n        background-color: ", ";\n        border: ", ";\n        border-radius: ", ";\n      }\n    }\n\n    &.danger {\n      background: ", ";\n      border: ", ";\n      border-color: ", ";\n      border-radius: ", ";\n    }\n  }\n\n  .ProseMirror\n    > .", ",\n    .", "\n    > .", " {\n    margin-left: -", "px;\n    margin-right: -", "px;\n  }\n\n  .", " {\n    ", "\n    cursor: text;\n    padding-top: 0px;\n  }\n\n  .", " {\n    ", "\n  }\n\n  .", " {\n    ", ";\n    overflow: visible;\n  }\n\n  .", " {\n    background: ", ";\n    border-color: ", ";\n\n    .", " {\n      padding-top: ", "px;\n    }\n  }\n\n  .", " {\n    width: 100%;\n  }\n\n  .", ":(.", ") {\n    .expand-content-wrapper {\n      height: auto;\n    }\n  }\n\n  .", ":not(.", ") {\n    .ak-editor-expand__content {\n      position: absolute;\n      height: 1px;\n      width: 1px;\n      overflow: hidden;\n      clip: rect(1px, 1px, 1px, 1px);\n      white-space: nowrap;\n    }\n\n    .", " svg {\n      ", ";\n      transform: rotate(0deg);\n    }\n\n    &:not(.", "):not(.danger) {\n      background: transparent;\n      border-color: transparent;\n\n      &:hover {\n        border-color: ", ";\n        background: ", ";\n      }\n    }\n  }\n"])), _classNames.expandClassNames.icon, _classNames.expandClassNames.prefix, _ui.sharedExpandStyles.ContainerStyles, _classNames.expandClassNames.iconContainer, EXPAND_ICON_COLOR, _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.Blanket, _editorSharedStyles.SelectionStyle.Border]), ACTIVE_STATE_BACKGROUND_COLOR, ACTIVE_STATE_BORDER, ACTIVE_STATE_BORDER_RADIUS, DANGER_STATE_BACKGROUND_COLOR, DANGER_STATE_BORDER, DANGER_STATE_BORDER_COLOR, DANGER_STATE_BORDER_RADIUS, _classNames.expandClassNames.type('expand'), _constants2.BreakoutCssClassName.BREAKOUT_MARK_DOM, _classNames.expandClassNames.type('expand'), _editorSharedStyles.akLayoutGutterOffset, _editorSharedStyles.akLayoutGutterOffset, _classNames.expandClassNames.content, _ui.sharedExpandStyles.ContentStyles, _classNames.expandClassNames.titleInput, _ui.sharedExpandStyles.TitleInputStyles, _classNames.expandClassNames.titleContainer, _ui.sharedExpandStyles.TitleContainerStyles, _classNames.expandClassNames.expanded, EXPAND_SELECTED_BACKGROUND, (0, _components.themed)({
   light: _colors.N40A,
   dark: _colors.DN50
 }), _classNames.expandClassNames.content, _constants.gridSize, _classNames.expandClassNames.inputContainer, _classNames.expandClassNames.prefix, _classNames.expandClassNames.expanded, _classNames.expandClassNames.prefix, _classNames.expandClassNames.expanded, _classNames.expandClassNames.iconContainer, EXPAND_ICON_COLOR, _editorSharedStyles.akEditorSelectedNodeClassName, (0, _components.themed)({

package/dist/cjs/plugins/extension/commands.js

@@ -80,9 +80,11 @@ var updateExtensionLayout = function updateExtensionLayout(layout) {
     var selectedExtension = (0, _utils.getSelectedExtension)(state, true);
 
     if (selectedExtension) {
-      return tr.setNodeMarkup(selectedExtension.pos, undefined, _objectSpread(_objectSpread({}, selectedExtension.node.attrs), {}, {
+      var trWithNewNodeMarkup = tr.setNodeMarkup(selectedExtension.pos, undefined, _objectSpread(_objectSpread({}, selectedExtension.node.attrs), {}, {
         layout: layout
       }));
+      trWithNewNodeMarkup.setMeta('scrollIntoView', false);
+      return trWithNewNodeMarkup;
     }
 
     return tr;