@atlaskit/editor-core 187.26.0 → 187.27.1

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-core
 
+## 187.27.1
+
+### Patch Changes
+
+- [`719a3a60441`](https://bitbucket.org/atlassian/atlassian-frontend/commits/719a3a60441) - ED-19411 minor refactor of ResizableMediaSingleNext
+
+## 187.27.0
+
+### Minor Changes
+
+- [`967f4819f58`](https://bitbucket.org/atlassian/atlassian-frontend/commits/967f4819f58) - Introduce core plugin that is always injected into the pluginInjectionApi. This has a new action `execute` that replaces the existing `executeCommand` that was called from the `pluginInjectionApi`.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 187.26.0
 
 ### Minor Changes

package/dist/cjs/plugins/insert-block/ui/ToolbarInsertBlock/index.js

@@ -170,19 +170,19 @@ var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
       }
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "toggleLinkPanel", function (inputMethod) {
-      var _pluginInjectionApi$e, _pluginInjectionApi$d, _pluginInjectionApi$d2;
+      var _pluginInjectionApi$d, _pluginInjectionApi$d2, _pluginInjectionApi$d3;
       var pluginInjectionApi = _this.props.pluginInjectionApi;
-      return (_pluginInjectionApi$e = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.executeCommand(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies) === null || _pluginInjectionApi$d === void 0 ? void 0 : (_pluginInjectionApi$d2 = _pluginInjectionApi$d.hyperlink) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.commands.showLinkToolbar(inputMethod))) !== null && _pluginInjectionApi$e !== void 0 ? _pluginInjectionApi$e : false;
+      return (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.dependencies.core.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d2 = pluginInjectionApi.dependencies) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : (_pluginInjectionApi$d3 = _pluginInjectionApi$d2.hyperlink) === null || _pluginInjectionApi$d3 === void 0 ? void 0 : _pluginInjectionApi$d3.commands.showLinkToolbar(inputMethod))) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : false;
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "insertMention", function (inputMethod) {
-      var _pluginInjectionApi$d3;
+      var _pluginInjectionApi$d4;
       var _this$props = _this.props,
         editorView = _this$props.editorView,
         pluginInjectionApi = _this$props.pluginInjectionApi;
       if (!editorView) {
         return true;
       }
-      var pluginState = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d3 = pluginInjectionApi.dependencies.mention) === null || _pluginInjectionApi$d3 === void 0 ? void 0 : _pluginInjectionApi$d3.sharedState.currentState();
+      var pluginState = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d4 = pluginInjectionApi.dependencies.mention) === null || _pluginInjectionApi$d4 === void 0 ? void 0 : _pluginInjectionApi$d4.sharedState.currentState();
       if (pluginState && pluginState.canInsertMention === false) {
         return false;
       }
@@ -190,13 +190,13 @@ var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
       return true;
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "insertTable", function (inputMethod) {
-      var _pluginInjectionApi$d4, _pluginInjectionApi$d5, _pluginInjectionApi$d6, _pluginInjectionApi$d7;
+      var _pluginInjectionApi$d5, _pluginInjectionApi$d6, _pluginInjectionApi$d7, _pluginInjectionApi$d8;
       var _this$props2 = _this.props,
         pluginInjectionApi = _this$props2.pluginInjectionApi,
         editorView = _this$props2.editorView;
       var state = editorView.state,
         dispatch = editorView.dispatch;
-      return (_pluginInjectionApi$d4 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d5 = pluginInjectionApi.dependencies.table) === null || _pluginInjectionApi$d5 === void 0 ? void 0 : (_pluginInjectionApi$d6 = (_pluginInjectionApi$d7 = _pluginInjectionApi$d5.actions).insertTable) === null || _pluginInjectionApi$d6 === void 0 ? void 0 : _pluginInjectionApi$d6.call(_pluginInjectionApi$d7, {
+      return (_pluginInjectionApi$d5 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d6 = pluginInjectionApi.dependencies.table) === null || _pluginInjectionApi$d6 === void 0 ? void 0 : (_pluginInjectionApi$d7 = (_pluginInjectionApi$d8 = _pluginInjectionApi$d6.actions).insertTable) === null || _pluginInjectionApi$d7 === void 0 ? void 0 : _pluginInjectionApi$d7.call(_pluginInjectionApi$d8, {
         action: _analytics.ACTION.INSERTED,
         actionSubject: _analytics.ACTION_SUBJECT.DOCUMENT,
         actionSubjectId: _analytics.ACTION_SUBJECT_ID.TABLE,
@@ -204,7 +204,7 @@ var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
           inputMethod: inputMethod
         },
         eventType: _analytics.EVENT_TYPE.TRACK
-      })(state, dispatch)) !== null && _pluginInjectionApi$d4 !== void 0 ? _pluginInjectionApi$d4 : false;
+      })(state, dispatch)) !== null && _pluginInjectionApi$d5 !== void 0 ? _pluginInjectionApi$d5 : false;
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "createDate", function (inputMethod) {
       var editorView = _this.props.editorView;
@@ -281,10 +281,10 @@ var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
       };
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleSelectedEmoji", function (emojiId) {
-      var _pluginInjectionApi$d8;
+      var _pluginInjectionApi$d9;
       var pluginInjectionApi = _this.props.pluginInjectionApi;
       _this.props.editorView.focus();
-      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.executeCommand((_pluginInjectionApi$d8 = pluginInjectionApi.dependencies.emoji) === null || _pluginInjectionApi$d8 === void 0 ? void 0 : _pluginInjectionApi$d8.commands.insertEmoji(emojiId, _analytics.INPUT_METHOD.PICKER));
+      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.dependencies.core.actions.execute((_pluginInjectionApi$d9 = pluginInjectionApi.dependencies.emoji) === null || _pluginInjectionApi$d9 === void 0 ? void 0 : _pluginInjectionApi$d9.commands.insertEmoji(emojiId, _analytics.INPUT_METHOD.PICKER));
       _this.toggleEmojiPicker();
       return true;
     });

package/dist/cjs/plugins/media/ui/ResizableMediaSingle/ResizableMediaSingleNext.js

@@ -111,10 +111,6 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       // so that we have image aligned with text
       return 'full-width';
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcColumnLeftOffset", function () {
-      var offsetLeft = _this.state.offsetLeft;
-      return _this.insideInlineLike ? (0, _ui.calcColumnsFromPx)(offsetLeft, _this.props.lineLength, _this.props.gridSize) : 0;
-    });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcPxHeight", function (newWidth) {
       var _this$props3 = _this.props,
         _this$props3$width = _this$props3.width,
@@ -126,9 +122,8 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       return _this.wrapper = wrapper;
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "displayGuideline", function (guidelines) {
-      var _pluginInjectionApi$d, _pluginInjectionApi$d2, _pluginInjectionApi$d3;
-      var pluginInjectionApi = _this.props.pluginInjectionApi;
-      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies) === null || _pluginInjectionApi$d === void 0 ? void 0 : (_pluginInjectionApi$d2 = _pluginInjectionApi$d.guideline) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : (_pluginInjectionApi$d3 = _pluginInjectionApi$d2.actions) === null || _pluginInjectionApi$d3 === void 0 ? void 0 : _pluginInjectionApi$d3.displayGuideline(_this.props.view)({
+      var _this$props$pluginInj, _this$props$pluginInj2, _this$props$pluginInj3, _this$props$pluginInj4;
+      return (_this$props$pluginInj = _this.props.pluginInjectionApi) === null || _this$props$pluginInj === void 0 ? void 0 : (_this$props$pluginInj2 = _this$props$pluginInj.dependencies) === null || _this$props$pluginInj2 === void 0 ? void 0 : (_this$props$pluginInj3 = _this$props$pluginInj2.guideline) === null || _this$props$pluginInj3 === void 0 ? void 0 : (_this$props$pluginInj4 = _this$props$pluginInj3.actions) === null || _this$props$pluginInj4 === void 0 ? void 0 : _this$props$pluginInj4.displayGuideline(_this.props.view)({
         guidelines: guidelines
       });
     });
@@ -155,9 +150,10 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       return (0, _mediaSingle.calcMediaSingleMaxWidth)(containerWidth);
     }));
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getRelativeGuides", function () {
-      var relativeGuides = _this.$pos && _this.$pos.nodeAfter && _this.state.size.width ? (0, _guideline.getRelativeGuidelines)(_this.state.relativeGuides, {
-        node: _this.$pos.nodeAfter,
-        pos: _this.$pos.pos
+      var $pos = _this.$pos;
+      var relativeGuides = $pos && $pos.nodeAfter && _this.state.size.width ? (0, _guideline.getRelativeGuidelines)(_this.state.relativeGuides, {
+        node: $pos.nodeAfter,
+        pos: $pos.pos
       }, _this.props.view, _this.props.lineLength, _this.state.size) : [];
       return relativeGuides;
     });
@@ -174,57 +170,20 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
         _this.displayGuideline([].concat((0, _toConsumableArray2.default)((0, _guideline.getGuidelinesWithHighlights)(gap, _mediaSingle.MEDIA_SINGLE_SNAP_GAP, activeGuidelineKeys, guidelines)), (0, _toConsumableArray2.default)(relativeGuidelines)));
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "roundPixelValue", function (value) {
-      return Math.round(value);
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getHeightFromNewWidth", function (originalWidth, originalHeight, newWidth) {
-      return _this.roundPixelValue(originalHeight / originalWidth * newWidth);
-    });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calculateSizeState", function (size, delta) {
-      var originalWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-      var originalHeight = arguments.length > 3 ? arguments[3] : undefined;
-      var onResizeStop = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
-      var calculatedWidth = _this.roundPixelValue(size.width + delta.width);
+      var onResizeStop = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+      var calculatedWidth = Math.round(size.width + delta.width);
       var calculatedWidthWithLayout = _this.calcNewSize(calculatedWidth, onResizeStop);
-      var calculatedHeightWithLayout = _this.getHeightFromNewWidth(originalWidth, originalHeight, calculatedWidth);
       return {
         width: calculatedWidth,
-        height: calculatedHeightWithLayout,
+        height: calculatedWidth / _this.aspectRatio,
         calculatedWidthWithLayout: calculatedWidthWithLayout
       };
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "selectCurrentMediaNode", function () {
       // TODO: if adding !this.props.selected, it doesn't work if media single node is at top postion
-      if (typeof _this.props.getPos === 'function') {
-        var propPos = _this.props.getPos();
-        if (propPos !== undefined) {
-          (0, _utils2.setNodeSelection)(_this.props.view, propPos);
-        }
-      }
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getParentNodeTypeNameFromCurrentPositionNode", function () {
-      var $pos = _this.$pos;
-      if (!$pos) {
-        return undefined;
-      }
-
-      // Supported Parent Nodes
-      var _this$props$view$stat = _this.props.view.state.schema.nodes,
-        listItem = _this$props$view$stat.listItem,
-        expand = _this$props$view$stat.expand,
-        tableCell = _this$props$view$stat.tableCell,
-        tableHeader = _this$props$view$stat.tableHeader,
-        layoutSection = _this$props$view$stat.layoutSection,
-        nestedExpand = _this$props$view$stat.nestedExpand;
-      var parentNode = (0, _utils.findParentNodeOfTypeClosestToPos)($pos, [listItem, expand, tableCell, tableHeader, layoutSection, nestedExpand]);
-
-      // Return matched parent node name
-      if (parentNode) {
-        return parentNode.node.type.name;
-      }
-
-      // Return undefined if parent node cannot be found
-      return undefined;
+      var pos = _this.pos;
+      pos && (0, _utils2.setNodeSelection)(_this.props.view, pos);
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleResizeStart", function () {
       _this.setState({
@@ -233,17 +192,15 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       _this.selectCurrentMediaNode();
       _this.setIsResizing(true);
       _this.updateSizeInPluginState(_this.state.size.width);
-      // re-calucate guidelines
+      // re-calculate guidelines
       _this.updateGuidelines();
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleResize", function (size, delta) {
       var _this$props4 = _this.props,
-        originalWidth = _this$props4.width,
-        originalHeight = _this$props4.height,
         layout = _this$props4.layout,
         updateSize = _this$props4.updateSize,
         lineLength = _this$props4.lineLength;
-      var _this$calculateSizeSt = _this.calculateSizeState(size, delta, originalWidth, originalHeight),
+      var _this$calculateSizeSt = _this.calculateSizeState(size, delta),
         width = _this$calculateSizeSt.width,
         height = _this$calculateSizeSt.height,
         calculatedWidthWithLayout = _this$calculateSizeSt.calculatedWidthWithLayout;
@@ -266,22 +223,21 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleResizeStop", function (size, delta) {
       var _this$props5 = _this.props,
-        originalWidth = _this$props5.width,
-        originalHeight = _this$props5.height,
         updateSize = _this$props5.updateSize,
         dispatchAnalyticsEvent = _this$props5.dispatchAnalyticsEvent,
         nodeType = _this$props5.nodeType;
-      var _this$calculateSizeSt2 = _this.calculateSizeState(size, delta, originalWidth, originalHeight, true),
+      var _this$calculateSizeSt2 = _this.calculateSizeState(size, delta, true),
         width = _this$calculateSizeSt2.width,
         height = _this$calculateSizeSt2.height,
         calculatedWidthWithLayout = _this$calculateSizeSt2.calculatedWidthWithLayout;
       if (dispatchAnalyticsEvent) {
+        var $pos = _this.$pos;
         var event = (0, _analytics.getMediaResizeAnalyticsEvent)(nodeType || 'mediaSingle', {
           width: width,
           layout: calculatedWidthWithLayout.layout,
           widthType: 'pixel',
           snapType: (0, _guideline.getGuidelineTypeFromKey)(_this.lastSnappedGuidelineKeys, _this.state.guidelines),
-          parentNode: _this.getParentNodeTypeNameFromCurrentPositionNode()
+          parentNode: $pos ? $pos.parent.type.name : undefined
         });
         if (event) {
           dispatchAnalyticsEvent(event);
@@ -315,23 +271,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
     };
     return _this;
   }
-
-  /**
-   * Calculate media single node initial width if props.mediaSingleWidth is undefined
-   * (Mainly when switching from lagacy experience to new experience).
-   *
-   * @returns initial width in pixel
-   */
   (0, _createClass2.default)(ResizableMediaSingleNext, [{
-    key: "calcInitialWidth",
-    value: function calcInitialWidth() {
-      var _this$props6 = this.props,
-        origWidth = _this$props6.width,
-        contentWidth = _this$props6.lineLength,
-        containerWidth = _this$props6.containerWidth;
-      return Math.max(Math.min(origWidth || _mediaSingle.DEFAULT_IMAGE_WIDTH, contentWidth || containerWidth || _editorSharedStyles.akEditorDefaultLayoutWidth), _mediaSingle.MEDIA_SINGLE_MIN_PIXEL_WIDTH);
-    }
-  }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
       var _this2 = this;
@@ -374,29 +314,6 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       }
       return true;
     }
-
-    // check if is inside of layout, table, expand, nestedExpand and list item
-  }, {
-    key: "isNestedNode",
-    value: function isNestedNode() {
-      return !!(this.$pos && this.$pos.parent.type.name !== 'doc');
-    }
-  }, {
-    key: "getDefaultGuidelines",
-    value: function getDefaultGuidelines() {
-      var _this$props7 = this.props,
-        lineLength = _this$props7.lineLength,
-        containerWidth = _this$props7.containerWidth,
-        fullWidthMode = _this$props7.fullWidthMode;
-
-      // disable guidelines for nested media single node
-      return this.isNestedNode() ? [] : (0, _guideline.generateDefaultGuidelines)(lineLength, containerWidth, fullWidthMode);
-    }
-  }, {
-    key: "wrappedLayout",
-    get: function get() {
-      return _ui.wrappedLayouts.indexOf(this.props.layout) > -1;
-    }
   }, {
     key: "componentDidMount",
     value: function () {
@@ -430,18 +347,82 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
         this.checkVideoFile(nextProps.viewMediaClientConfig);
       }
     }
+  }, {
+    key: "wrappedLayout",
+    get: function get() {
+      return _ui.wrappedLayouts.indexOf(this.props.layout) > -1;
+    }
+  }, {
+    key: "pos",
+    get: function get() {
+      if (typeof this.props.getPos !== 'function') {
+        return null;
+      }
+      var pos = this.props.getPos();
+      if (Number.isNaN(pos) || typeof pos !== 'number') {
+        return null;
+      }
+      return pos;
+    }
+  }, {
+    key: "$pos",
+    get: function get() {
+      var pos = this.pos;
+      // need to pass view because we may not get updated props in time
+      return pos && this.props.view.state.doc.resolve(pos);
+    }
   }, {
     key: "aspectRatio",
     get: function get() {
-      var _this$props8 = this.props,
-        width = _this$props8.width,
-        height = _this$props8.height;
+      var _this$props6 = this.props,
+        width = _this$props6.width,
+        height = _this$props6.height;
       if (width) {
         return width / height;
       }
+
       // TODO handle this case
       return 1;
     }
+  }, {
+    key: "insideInlineLike",
+    get: function get() {
+      var $pos = this.$pos;
+      if (!$pos) {
+        return false;
+      }
+      var listItem = this.props.view.state.schema.nodes.listItem;
+      return !!(0, _utils.findParentNodeOfTypeClosestToPos)($pos, [listItem]);
+    }
+  }, {
+    key: "insideLayout",
+    get: function get() {
+      var $pos = this.$pos;
+      if (!$pos) {
+        return false;
+      }
+      var layoutColumn = this.props.view.state.schema.nodes.layoutColumn;
+      return !!(0, _utils.findParentNodeOfTypeClosestToPos)($pos, [layoutColumn]);
+    }
+
+    // check if is inside of layout, table, expand, nestedExpand and list item
+  }, {
+    key: "isNestedNode",
+    value: function isNestedNode() {
+      var $pos = this.$pos;
+      return !!($pos && $pos.parent.type !== $pos.parent.type.schema.nodes.doc);
+    }
+  }, {
+    key: "getDefaultGuidelines",
+    value: function getDefaultGuidelines() {
+      var _this$props7 = this.props,
+        lineLength = _this$props7.lineLength,
+        containerWidth = _this$props7.containerWidth,
+        fullWidthMode = _this$props7.fullWidthMode;
+
+      // disable guidelines for nested media single node
+      return this.isNestedNode() ? [] : (0, _guideline.generateDefaultGuidelines)(lineLength, containerWidth, fullWidthMode);
+    }
   }, {
     key: "checkVideoFile",
     value: function () {
@@ -496,63 +477,19 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       }
       return checkVideoFile;
     }()
-  }, {
-    key: "$pos",
-    get: function get() {
-      if (typeof this.props.getPos !== 'function') {
-        return null;
-      }
-      var pos = this.props.getPos();
-      if (Number.isNaN(pos) || typeof pos !== 'number') {
-        return null;
-      }
-
-      // need to pass view because we may not get updated props in time
-      return this.props.view.state.doc.resolve(pos);
-    }
-
-    /**
-     * The maxmimum number of grid columns this node can resize to.
-     */
-  }, {
-    key: "gridWidth",
-    get: function get() {
-      var gridSize = this.props.gridSize;
-      return !(this.wrappedLayout || this.insideInlineLike) ? gridSize / 2 : gridSize;
-    }
-  }, {
-    key: "insideInlineLike",
-    get: function get() {
-      var $pos = this.$pos;
-      if (!$pos) {
-        return false;
-      }
-      var listItem = this.props.view.state.schema.nodes.listItem;
-      return !!(0, _utils.findParentNodeOfTypeClosestToPos)($pos, [listItem]);
-    }
-  }, {
-    key: "insideLayout",
-    get: function get() {
-      var $pos = this.$pos;
-      if (!$pos) {
-        return false;
-      }
-      var layoutColumn = this.props.view.state.schema.nodes.layoutColumn;
-      return !!(0, _utils.findParentNodeOfTypeClosestToPos)($pos, [layoutColumn]);
-    }
   }, {
     key: "render",
     value: function render() {
       var _this3 = this;
-      var _this$props9 = this.props,
-        origWidth = _this$props9.width,
-        layout = _this$props9.layout,
-        pctWidth = _this$props9.pctWidth,
-        containerWidth = _this$props9.containerWidth,
-        fullWidthMode = _this$props9.fullWidthMode,
-        selected = _this$props9.selected,
-        children = _this$props9.children,
-        lineLength = _this$props9.lineLength;
+      var _this$props8 = this.props,
+        origWidth = _this$props8.width,
+        layout = _this$props8.layout,
+        pctWidth = _this$props8.pctWidth,
+        containerWidth = _this$props8.containerWidth,
+        fullWidthMode = _this$props8.fullWidthMode,
+        selected = _this$props8.selected,
+        children = _this$props8.children,
+        lineLength = _this$props8.lineLength;
       var _this$state = this.state,
         isResizing = _this$state.isResizing,
         size = _this$state.size;

package/dist/cjs/use-preset.js

@@ -27,7 +27,7 @@ var _context = require("./presets/context");
  *   , []);
  *
  *   // Can execute typesafe commands based on plugin1 or 2
- *   const runCommand = () => editorApi.executeCommand(
+ *   const runCommand = () => editorApi.dependencies.core.actions.execute(
  *     editorApi.dependencies.plugin1.commands.doSomething()
  *   )
  *   return (

package/dist/cjs/version-wrapper.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.version = exports.nextMajorVersion = exports.name = void 0;
 var name = "@atlaskit/editor-core";
 exports.name = name;
-var version = "187.26.0";
+var version = "187.27.1";
 exports.version = version;
 var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');

package/dist/es2019/plugins/insert-block/ui/ToolbarInsertBlock/index.js

@@ -151,14 +151,14 @@ export class ToolbarInsertBlock extends React.PureComponent {
       }
     });
     _defineProperty(this, "toggleLinkPanel", inputMethod => {
-      var _pluginInjectionApi$e, _pluginInjectionApi$d, _pluginInjectionApi$d2;
+      var _pluginInjectionApi$d, _pluginInjectionApi$d2, _pluginInjectionApi$d3;
       const {
         pluginInjectionApi
       } = this.props;
-      return (_pluginInjectionApi$e = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.executeCommand(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies) === null || _pluginInjectionApi$d === void 0 ? void 0 : (_pluginInjectionApi$d2 = _pluginInjectionApi$d.hyperlink) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.commands.showLinkToolbar(inputMethod))) !== null && _pluginInjectionApi$e !== void 0 ? _pluginInjectionApi$e : false;
+      return (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.dependencies.core.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d2 = pluginInjectionApi.dependencies) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : (_pluginInjectionApi$d3 = _pluginInjectionApi$d2.hyperlink) === null || _pluginInjectionApi$d3 === void 0 ? void 0 : _pluginInjectionApi$d3.commands.showLinkToolbar(inputMethod))) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : false;
     });
     _defineProperty(this, "insertMention", inputMethod => {
-      var _pluginInjectionApi$d3;
+      var _pluginInjectionApi$d4;
       const {
         editorView,
         pluginInjectionApi
@@ -166,7 +166,7 @@ export class ToolbarInsertBlock extends React.PureComponent {
       if (!editorView) {
         return true;
       }
-      const pluginState = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d3 = pluginInjectionApi.dependencies.mention) === null || _pluginInjectionApi$d3 === void 0 ? void 0 : _pluginInjectionApi$d3.sharedState.currentState();
+      const pluginState = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d4 = pluginInjectionApi.dependencies.mention) === null || _pluginInjectionApi$d4 === void 0 ? void 0 : _pluginInjectionApi$d4.sharedState.currentState();
       if (pluginState && pluginState.canInsertMention === false) {
         return false;
       }
@@ -174,7 +174,7 @@ export class ToolbarInsertBlock extends React.PureComponent {
       return true;
     });
     _defineProperty(this, "insertTable", inputMethod => {
-      var _pluginInjectionApi$d4, _pluginInjectionApi$d5, _pluginInjectionApi$d6, _pluginInjectionApi$d7;
+      var _pluginInjectionApi$d5, _pluginInjectionApi$d6, _pluginInjectionApi$d7, _pluginInjectionApi$d8;
       const {
         pluginInjectionApi,
         editorView
@@ -183,7 +183,7 @@ export class ToolbarInsertBlock extends React.PureComponent {
         state,
         dispatch
       } = editorView;
-      return (_pluginInjectionApi$d4 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d5 = pluginInjectionApi.dependencies.table) === null || _pluginInjectionApi$d5 === void 0 ? void 0 : (_pluginInjectionApi$d6 = (_pluginInjectionApi$d7 = _pluginInjectionApi$d5.actions).insertTable) === null || _pluginInjectionApi$d6 === void 0 ? void 0 : _pluginInjectionApi$d6.call(_pluginInjectionApi$d7, {
+      return (_pluginInjectionApi$d5 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d6 = pluginInjectionApi.dependencies.table) === null || _pluginInjectionApi$d6 === void 0 ? void 0 : (_pluginInjectionApi$d7 = (_pluginInjectionApi$d8 = _pluginInjectionApi$d6.actions).insertTable) === null || _pluginInjectionApi$d7 === void 0 ? void 0 : _pluginInjectionApi$d7.call(_pluginInjectionApi$d8, {
         action: ACTION.INSERTED,
         actionSubject: ACTION_SUBJECT.DOCUMENT,
         actionSubjectId: ACTION_SUBJECT_ID.TABLE,
@@ -191,7 +191,7 @@ export class ToolbarInsertBlock extends React.PureComponent {
           inputMethod
         },
         eventType: EVENT_TYPE.TRACK
-      })(state, dispatch)) !== null && _pluginInjectionApi$d4 !== void 0 ? _pluginInjectionApi$d4 : false;
+      })(state, dispatch)) !== null && _pluginInjectionApi$d5 !== void 0 ? _pluginInjectionApi$d5 : false;
     });
     _defineProperty(this, "createDate", inputMethod => {
       const {
@@ -282,12 +282,12 @@ export class ToolbarInsertBlock extends React.PureComponent {
       return true;
     });
     _defineProperty(this, "handleSelectedEmoji", emojiId => {
-      var _pluginInjectionApi$d8;
+      var _pluginInjectionApi$d9;
       const {
         pluginInjectionApi
       } = this.props;
       this.props.editorView.focus();
-      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.executeCommand((_pluginInjectionApi$d8 = pluginInjectionApi.dependencies.emoji) === null || _pluginInjectionApi$d8 === void 0 ? void 0 : _pluginInjectionApi$d8.commands.insertEmoji(emojiId, INPUT_METHOD.PICKER));
+      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.dependencies.core.actions.execute((_pluginInjectionApi$d9 = pluginInjectionApi.dependencies.emoji) === null || _pluginInjectionApi$d9 === void 0 ? void 0 : _pluginInjectionApi$d9.commands.insertEmoji(emojiId, INPUT_METHOD.PICKER));
       this.toggleEmojiPicker();
       return true;
     });