@atlaskit/editor-core 183.0.9 → 183.1.0

package/dist/cjs/plugins/list/utils/indentation.js

@@ -5,16 +5,16 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.hasValidListIndentationLevel = exports.getListLiftTarget = void 0;
 var _selection = require("./selection");
-var _node = require("./node");
+var _utils = require("@atlaskit/editor-common/utils");
 // This will return (depth - 1) for root list parent of a list.
 var getListLiftTarget = function getListLiftTarget(resPos) {
   var target = resPos.depth;
   for (var i = resPos.depth; i > 0; i--) {
     var node = resPos.node(i);
-    if ((0, _node.isListNode)(node)) {
+    if ((0, _utils.isListNode)(node)) {
       target = i;
     }
-    if (!(0, _node.isListItemNode)(node) && !(0, _node.isListNode)(node)) {
+    if (!(0, _utils.isListItemNode)(node) && !(0, _utils.isListNode)(node)) {
       break;
     }
   }

package/dist/cjs/plugins/list/utils/node.js

@@ -4,31 +4,40 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.JoinDirection = void 0;
-exports.isBulletList = isBulletList;
-exports.isListItemNode = isListItemNode;
-exports.isListNode = isListNode;
-exports.isParagraphNode = isParagraphNode;
+Object.defineProperty(exports, "isBulletList", {
+  enumerable: true,
+  get: function get() {
+    return _utils.isBulletList;
+  }
+});
+Object.defineProperty(exports, "isListItemNode", {
+  enumerable: true,
+  get: function get() {
+    return _utils.isListItemNode;
+  }
+});
+Object.defineProperty(exports, "isListNode", {
+  enumerable: true,
+  get: function get() {
+    return _utils.isListNode;
+  }
+});
+Object.defineProperty(exports, "isParagraphNode", {
+  enumerable: true,
+  get: function get() {
+    return _utils.isParagraphNode;
+  }
+});
 exports.joinSiblingLists = void 0;
 var _prosemirrorModel = require("prosemirror-model");
-function isListNode(node) {
-  return Boolean(node && node.type && ['orderedList', 'bulletList'].includes(node.type.name));
-}
-function isParagraphNode(node) {
-  return Boolean(node && node.type && 'paragraph' === node.type.name);
-}
-function isListItemNode(node) {
-  return Boolean(node && node.type && 'listItem' === node.type.name);
-}
-function isBulletList(node) {
-  return Boolean(node && node.type && 'bulletList' === node.type.name);
-}
+var _utils = require("@atlaskit/editor-common/utils");
 function isListNodeValidContent(node) {
   var bulletList = node.type.schema.nodes.bulletList;
   if (!bulletList) {
     return false;
   }
   var listFragment = _prosemirrorModel.Fragment.from(bulletList.createAndFill());
-  return !isListItemNode(node) && node.type.validContent(listFragment);
+  return !(0, _utils.isListItemNode)(node) && node.type.validContent(listFragment);
 }
 var JoinDirection = /*#__PURE__*/function (JoinDirection) {
   JoinDirection[JoinDirection["LEFT"] = 1] = "LEFT";
@@ -54,17 +63,17 @@ var joinSiblingLists = function joinSiblingLists(_ref) {
     return result;
   }
   var rootListNode = doc.nodeAt(range.start);
-  var from = isListNode(rootListNode) ? range.start : 0;
-  var to = isListNode(rootListNode) ? range.end : tr.doc.content.size;
+  var from = (0, _utils.isListNode)(rootListNode) ? range.start : 0;
+  var to = (0, _utils.isListNode)(rootListNode) ? range.end : tr.doc.content.size;
   var joins = [];
   doc.nodesBetween(from, to, function (node, pos, parent) {
     var resolvedPos = doc.resolve(pos);
     var nodeBefore = resolvedPos.nodeBefore,
       nodeAfter = resolvedPos.nodeAfter;
-    if (!nodeBefore || !nodeAfter || !isListNode(nodeBefore) || !isListNode(nodeAfter)) {
+    if (!nodeBefore || !nodeAfter || !(0, _utils.isListNode)(nodeBefore) || !(0, _utils.isListNode)(nodeAfter)) {
       return;
     }
-    var isNestedList = isListItemNode(parent);
+    var isNestedList = (0, _utils.isListItemNode)(parent);
     if (!isNestedList && nodeBefore.type !== nodeAfter.type && !forceListType) {
       return;
     }
@@ -89,11 +98,11 @@ var joinSiblingLists = function joinSiblingLists(_ref) {
       joins.push(pos);
     }
   });
-  if (selection.empty && rootListNode && isListNode(rootListNode)) {
+  if (selection.empty && rootListNode && (0, _utils.isListNode)(rootListNode)) {
     var resolvedPos = doc.resolve(range.start + rootListNode.nodeSize);
     var nodeBefore = resolvedPos.nodeBefore,
       nodeAfter = resolvedPos.nodeAfter;
-    if (nodeBefore && nodeAfter && isListNode(nodeBefore) && isListNode(nodeAfter) && nodeAfter.type === nodeBefore.type) {
+    if (nodeBefore && nodeAfter && (0, _utils.isListNode)(nodeBefore) && (0, _utils.isListNode)(nodeAfter) && nodeAfter.type === nodeBefore.type) {
       joins.push(resolvedPos.pos);
     }
   }

package/dist/cjs/plugins/list/utils/selection.js

@@ -8,14 +8,14 @@ var _prosemirrorTransform = require("prosemirror-transform");
 var _prosemirrorState = require("prosemirror-state");
 var _prosemirrorUtils = require("prosemirror-utils");
 var _gapCursorSelection = require("../../selection/gap-cursor-selection");
-var _node = require("./node");
+var _utils = require("@atlaskit/editor-common/utils");
 var isPosInsideParagraph = function isPosInsideParagraph($pos) {
   return $pos.parent.type.name === 'paragraph';
 };
 exports.isPosInsideParagraph = isPosInsideParagraph;
 var isPosInsideList = function isPosInsideList($pos) {
   var posGrandParent = $pos.node(-1);
-  return (0, _node.isListItemNode)($pos.parent) || (0, _node.isListNode)($pos.parent) || (0, _node.isListItemNode)(posGrandParent);
+  return (0, _utils.isListItemNode)($pos.parent) || (0, _utils.isListNode)($pos.parent) || (0, _utils.isListItemNode)(posGrandParent);
 };
 exports.isPosInsideList = isPosInsideList;
 var isWrappingPossible = function isWrappingPossible(nodeType, selection) {
@@ -44,9 +44,9 @@ var isInsideListItem = function isInsideListItem(state) {
   var parent = state.selection.$from.parent;
   var listItem = state.schema.nodes.listItem;
   if (state.selection instanceof _gapCursorSelection.GapCursorSelection) {
-    return (0, _node.isListItemNode)(parent);
+    return (0, _utils.isListItemNode)(parent);
   }
-  return (0, _prosemirrorUtils.hasParentNodeOfType)(listItem)(state.selection) && (0, _node.isParagraphNode)(parent);
+  return (0, _prosemirrorUtils.hasParentNodeOfType)(listItem)(state.selection) && (0, _utils.isParagraphNode)(parent);
 };
 exports.isInsideListItem = isInsideListItem;
 var isInsideTableCell = function isInsideTableCell(state) {
@@ -63,7 +63,7 @@ var canJoinToPreviousListItem = function canJoinToPreviousListItem(state) {
   if (state.selection instanceof _gapCursorSelection.GapCursorSelection) {
     nodeBefore = $from.nodeBefore;
   }
-  return (0, _node.isListNode)(nodeBefore);
+  return (0, _utils.isListNode)(nodeBefore);
 };
 exports.canJoinToPreviousListItem = canJoinToPreviousListItem;
 var selectionContainsList = function selectionContainsList(tr) {
@@ -72,7 +72,7 @@ var selectionContainsList = function selectionContainsList(tr) {
     to = _tr$selection.to;
   var foundListNode = null;
   tr.doc.nodesBetween(from, to, function (node) {
-    if ((0, _node.isListNode)(node)) {
+    if ((0, _utils.isListNode)(node)) {
       foundListNode = node;
     }
     if (foundListNode) {
@@ -87,7 +87,7 @@ var numberNestedLists = function numberNestedLists(resolvedPos) {
   var count = 0;
   for (var i = resolvedPos.depth - 1; i > 0; i--) {
     var node = resolvedPos.node(i);
-    if ((0, _node.isListNode)(node)) {
+    if ((0, _utils.isListNode)(node)) {
       count += 1;
     }
   }
@@ -96,7 +96,7 @@ var numberNestedLists = function numberNestedLists(resolvedPos) {
 exports.numberNestedLists = numberNestedLists;
 var getListItemAttributes = function getListItemAttributes($pos) {
   var indentLevel = numberNestedLists($pos) - 1;
-  var itemAtPos = (0, _prosemirrorUtils.findParentNodeClosestToPos)($pos, _node.isListItemNode);
+  var itemAtPos = (0, _prosemirrorUtils.findParentNodeClosestToPos)($pos, _utils.isListItemNode);
 
   // Get the index of the current item relative to parent (parent is at item depth - 1)
   var itemIndex = $pos.index(itemAtPos ? itemAtPos.depth - 1 : undefined);
@@ -124,12 +124,12 @@ var normalizeListItemsSelection = function normalizeListItemsSelection(_ref) {
 };
 exports.normalizeListItemsSelection = normalizeListItemsSelection;
 var resolvePositionToStartOfListItem = function resolvePositionToStartOfListItem($pos) {
-  var fromRange = $pos.blockRange($pos, _node.isListItemNode);
+  var fromRange = $pos.blockRange($pos, _utils.isListItemNode);
   var fromPosition = fromRange && $pos.textOffset === 0 && fromRange.end - 1 === $pos.pos ? _prosemirrorState.Selection.near($pos.doc.resolve(fromRange.end + 1), 1).$from : $pos;
   return fromPosition;
 };
 var resolvePositionToEndOfListItem = function resolvePositionToEndOfListItem($pos) {
-  var toRange = $pos.blockRange($pos, _node.isListItemNode);
+  var toRange = $pos.blockRange($pos, _utils.isListItemNode);
   var toPosition = toRange && $pos.textOffset === 0 && toRange.start + 1 === $pos.pos ? _prosemirrorState.Selection.near($pos.doc.resolve(toRange.start - 1), -1).$to : $pos;
   return toPosition;
 };
@@ -137,7 +137,7 @@ var createListNodeRange = function createListNodeRange(_ref2) {
   var selection = _ref2.selection;
   var $from = selection.$from,
     $to = selection.$to;
-  var range = $from.blockRange($to, _node.isListNode);
+  var range = $from.blockRange($to, _utils.isListNode);
   if (!range) {
     return null;
   }

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

@@ -12,7 +12,7 @@ var _assert = _interopRequireDefault(require("assert"));
 var _prosemirrorState = require("prosemirror-state");
 var _prosemirrorUtils = require("prosemirror-utils");
 var _validator = require("@atlaskit/editor-common/validator");
-var _utils = require("../../utils");
+var _insert = require("@atlaskit/editor-common/insert");
 var _pluginFactory = require("../extension/plugin-factory");
 var _analytics = require("../analytics");
 var _extensionEvents = require("../analytics/types/extension-events");
@@ -131,7 +131,7 @@ var resolveMacro = function resolveMacro(macro, state, optionalAttrs) {
   } else if (type === 'inlineExtension') {
     node = schema.nodes.inlineExtension.create(attrs);
   }
-  return (0, _utils.normaliseNestedLayout)(state, node);
+  return (0, _insert.normaliseNestedLayout)(state, node);
 };
 
 // gets the macroProvider from the state and tries to autoConvert a given text

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

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.unlink = exports.showLinkingToolbarWithMediaTypeCheck = exports.showLinkingToolbar = exports.setUrlToMedia = exports.hideLinkingToolbar = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _linking = require("../pm-plugins/linking");
-var _utils = require("../../hyperlink/utils");
+var _utils = require("@atlaskit/editor-common/utils");
 var _commands = require("../../../commands");
 var _actions = require("../pm-plugins/linking/actions");
 var _analytics = require("../../analytics");

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

@@ -94,7 +94,7 @@ var mediaPlugin = function mediaPlugin() {
             providerFactory: providerFactory,
             nodeViews: {
               mediaGroup: (0, _mediaGroup.ReactMediaGroupNode)(portalProviderAPI, eventDispatcher, providerFactory, options),
-              mediaSingle: (0, _mediaSingle.ReactMediaSingleNode)(portalProviderAPI, eventDispatcher, providerFactory, dispatchAnalyticsEvent, options),
+              mediaSingle: (0, _mediaSingle.ReactMediaSingleNode)(portalProviderAPI, eventDispatcher, providerFactory, dispatchAnalyticsEvent, options, api),
               media: (0, _mediaNodeView.ReactMediaNode)(portalProviderAPI, eventDispatcher, providerFactory, options),
               mediaInline: (0, _mediaInline.ReactMediaInlineNode)(portalProviderAPI, eventDispatcher, providerFactory)
             },

package/dist/cjs/plugins/media/nodeviews/mediaSingle.js

@@ -27,7 +27,6 @@ var _WithPluginState = _interopRequireDefault(require("../../../ui/WithPluginSta
 var _width = require("../../width");
 var _utils2 = require("../../../utils");
 var _ResizableMediaSingle = _interopRequireDefault(require("../ui/ResizableMediaSingle"));
-var _grid = require("../../../plugins/grid");
 var _main = require("../pm-plugins/main");
 var _mediaNodeUpdater = require("./mediaNodeUpdater");
 var _prosemirrorUtils = require("prosemirror-utils");
@@ -233,11 +232,22 @@ var MediaSingleNode = /*#__PURE__*/function (_Component) {
       }
       (_this$captionPlaceHol = _this.captionPlaceHolderRef.current) === null || _this$captionPlaceHol === void 0 ? void 0 : _this$captionPlaceHol.click();
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "clickPlaceholder", function () {
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "displayGrid", function (visible, gridType, highlight) {
+      var _pluginInjectionApi$d, _pluginInjectionApi$d2;
       var _this$props = _this.props,
-        view = _this$props.view,
-        getPos = _this$props.getPos,
-        node = _this$props.node;
+        pluginInjectionApi = _this$props.pluginInjectionApi,
+        view = _this$props.view;
+      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies) === null || _pluginInjectionApi$d === void 0 ? void 0 : (_pluginInjectionApi$d2 = _pluginInjectionApi$d.grid) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions.displayGrid(view)({
+        visible: visible,
+        gridType: gridType,
+        highlight: highlight
+      });
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "clickPlaceholder", function () {
+      var _this$props2 = _this.props,
+        view = _this$props2.view,
+        getPos = _this$props2.getPos,
+        node = _this$props2.node;
       if (typeof getPos === 'boolean') {
         return;
       }
@@ -309,14 +319,14 @@ var MediaSingleNode = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var _this$props2 = this.props,
-        selected = _this$props2.selected,
-        getPos = _this$props2.getPos,
-        node = _this$props2.node,
-        mediaOptions = _this$props2.mediaOptions,
-        fullWidthMode = _this$props2.fullWidthMode,
-        state = _this$props2.view.state,
-        view = _this$props2.view;
+      var _this$props3 = this.props,
+        selected = _this$props3.selected,
+        getPos = _this$props3.getPos,
+        node = _this$props3.node,
+        mediaOptions = _this$props3.mediaOptions,
+        fullWidthMode = _this$props3.fullWidthMode,
+        state = _this$props3.view.state,
+        view = _this$props3.view;
       var _ref4 = node.attrs,
         layout = _ref4.layout,
         mediaSingleWidth = _ref4.width;
@@ -388,7 +398,7 @@ var MediaSingleNode = /*#__PURE__*/function (_Component) {
         view: this.props.view,
         getPos: getPos,
         updateSize: this.updateSize,
-        displayGrid: (0, _grid.createDisplayGrid)(this.props.eventDispatcher),
+        displayGrid: this.displayGrid,
         gridSize: 12,
         viewMediaClientConfig: this.state.viewMediaClientConfig,
         allowBreakoutSnapPoints: mediaOptions && mediaOptions.allowBreakoutSnapPoints,
@@ -496,7 +506,8 @@ var MediaSingleNodeView = /*#__PURE__*/function (_ReactNodeView) {
         fullWidthMode = _this$reactComponentP.fullWidthMode,
         providerFactory = _this$reactComponentP.providerFactory,
         mediaOptions = _this$reactComponentP.mediaOptions,
-        dispatchAnalyticsEvent = _this$reactComponentP.dispatchAnalyticsEvent;
+        dispatchAnalyticsEvent = _this$reactComponentP.dispatchAnalyticsEvent,
+        pluginInjectionApi = _this$reactComponentP.pluginInjectionApi;
 
       // getPos is a boolean for marks, since this is a node we know it must be a function
       var getPos = this.getPos;
@@ -529,7 +540,8 @@ var MediaSingleNodeView = /*#__PURE__*/function (_ReactNodeView) {
                 eventDispatcher: eventDispatcher,
                 mediaPluginState: mediaPluginState,
                 dispatchAnalyticsEvent: dispatchAnalyticsEvent,
-                forwardRef: forwardRef
+                forwardRef: forwardRef,
+                pluginInjectionApi: pluginInjectionApi
               });
             }
           });
@@ -557,6 +569,7 @@ var MediaSingleNodeView = /*#__PURE__*/function (_ReactNodeView) {
 }(_ReactNodeView2.default);
 var ReactMediaSingleNode = function ReactMediaSingleNode(portalProviderAPI, eventDispatcher, providerFactory, dispatchAnalyticsEvent) {
   var mediaOptions = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
+  var pluginInjectionApi = arguments.length > 5 ? arguments[5] : undefined;
   return function (node, view, getPos) {
     var hasIntlContext = true;
     return new MediaSingleNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, {
@@ -565,7 +578,8 @@ var ReactMediaSingleNode = function ReactMediaSingleNode(portalProviderAPI, even
       providerFactory: providerFactory,
       mediaOptions: mediaOptions,
       dispatchAnalyticsEvent: dispatchAnalyticsEvent,
-      isCopyPasteEnabled: mediaOptions.isCopyPasteEnabled
+      isCopyPasteEnabled: mediaOptions.isCopyPasteEnabled,
+      pluginInjectionApi: pluginInjectionApi
     }, undefined, undefined, undefined, hasIntlContext).init();
   };
 };

package/dist/cjs/plugins/media/pm-plugins/alt-text/index.js

@@ -9,13 +9,13 @@ var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _prosemirrorState = require("prosemirror-state");
 var _pluginStateFactory = require("../../../../utils/plugin-state-factory");
 var _reducer = _interopRequireDefault(require("./reducer"));
-var _pmHistoryTypes = require("../../../history/pm-history-types");
+var _utils = require("@atlaskit/editor-common/utils");
 var pluginKey = new _prosemirrorState.PluginKey('mediaAltTextPlugin');
 exports.pluginKey = pluginKey;
 var _pluginFactory = (0, _pluginStateFactory.pluginFactory)(pluginKey, _reducer.default, {
     onSelectionChanged: function onSelectionChanged(tr, newState) {
       // dont close alt text for undo/redo transactions (if it comes from prosemirror-history)
-      if (tr.getMeta(_pmHistoryTypes.pmHistoryPluginKey)) {
+      if (tr.getMeta(_utils.pmHistoryPluginKey)) {
         return newState;
       }
       return {

package/dist/cjs/plugins/media/pm-plugins/alt-text/ui/AltTextEdit.js

@@ -21,7 +21,7 @@ var _chevronLeftLarge = _interopRequireDefault(require("@atlaskit/icon/glyph/che
 var _crossCircle = _interopRequireDefault(require("@atlaskit/icon/glyph/cross-circle"));
 var _messages = require("../messages");
 var _reactIntlNext = require("react-intl-next");
-var _Button = _interopRequireDefault(require("../../../../floating-toolbar/ui/Button"));
+var _ui = require("@atlaskit/editor-common/ui");
 var _PanelTextInput = _interopRequireDefault(require("../../../../../ui/PanelTextInput"));
 var keymaps = _interopRequireWildcard(require("../../../../../keymaps"));
 var _commands = require("../commands");
@@ -29,7 +29,6 @@ var _analyticsNext = require("@atlaskit/analytics-next");
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _ToolbarComponents = require("../../../../../ui/LinkSearch/ToolbarComponents");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-var _ui = require("@atlaskit/editor-common/ui");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
 /** @jsx jsx */
 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); }
@@ -153,7 +152,7 @@ var AltTextEditComponent = /*#__PURE__*/function (_React$Component) {
         css: inputWrapper
       }, (0, _react2.jsx)("div", {
         css: buttonWrapper
-      }, (0, _react2.jsx)(_Button.default, {
+      }, (0, _react2.jsx)(_ui.FloatingToolbarButton, {
         title: formatMessage(_messages.messages.back),
         icon: (0, _react2.jsx)(_chevronLeftLarge.default, {
           label: formatMessage(_messages.messages.back)
@@ -174,7 +173,7 @@ var AltTextEditComponent = /*#__PURE__*/function (_React$Component) {
         autoFocus: true
       }), showClearTextButton && (0, _react2.jsx)("div", {
         css: buttonWrapper
-      }, (0, _react2.jsx)(_Button.default, {
+      }, (0, _react2.jsx)(_ui.FloatingToolbarButton, {
         testId: "alt-text-clear-button",
         title: formatMessage(_messages.messages.clear),
         icon: (0, _react2.jsx)("span", {

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

@@ -12,7 +12,7 @@ var _reactDom = _interopRequireDefault(require("react-dom"));
 var _mediaViewer = require("@atlaskit/media-viewer");
 var _mediaUi = require("@atlaskit/media-ui");
 var _filePreview = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/file-preview"));
-var _Button = _interopRequireDefault(require("../../floating-toolbar/ui/Button"));
+var _ui = require("@atlaskit/editor-common/ui");
 var _utils = require("./utils");
 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; }
@@ -54,7 +54,7 @@ var FilePreviewItem = function FilePreviewItem(_ref) {
   };
   var mediaViewer = renderMediaViewer();
   var tooltipContent = intl.formatMessage(_mediaUi.messages.preview);
-  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Button.default, {
+  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_ui.FloatingToolbarButton, {
     testId: "file-preview-toolbar-button",
     key: "editor.media.card.preview",
     onClick: openMediaViewer,

package/dist/cjs/plugins/media/toolbar/linking-toolbar-appearance.js

@@ -14,7 +14,7 @@ var _link = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/link"));
 var _shortcut = _interopRequireDefault(require("@atlaskit/icon/glyph/shortcut"));
 var _adfSchema = require("@atlaskit/adf-schema");
 var _checkMediaType = require("../utils/check-media-type");
-var _Button = _interopRequireDefault(require("../../floating-toolbar/ui/Button"));
+var _ui = require("@atlaskit/editor-common/ui");
 var _Separator = _interopRequireDefault(require("../../floating-toolbar/ui/Separator"));
 var _messages = require("../../../messages");
 var _keymaps = require("../../../keymaps");
@@ -62,7 +62,7 @@ var LinkToolbarAppearance = function LinkToolbarAppearance(_ref) {
     var linkTitle = intl.formatMessage(isValidUrl ? _messages.linkMessages.openLink : _messages.linkToolbarMessages.unableToOpenLink);
     return (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)("div", {
       css: wrapper
-    }, (0, _react2.jsx)(_Button.default, {
+    }, (0, _react2.jsx)(_ui.FloatingToolbarButton, {
       onClick: onEditLink,
       title: title,
       tooltipContent: (0, _react2.jsx)(_keymaps.ToolTipContent, {
@@ -72,7 +72,7 @@ var LinkToolbarAppearance = function LinkToolbarAppearance(_ref) {
       testId: "edit-link-button"
     }, title)), (0, _react2.jsx)("div", {
       css: wrapper
-    }, (0, _react2.jsx)(_Separator.default, null)), (0, _react2.jsx)(_Button.default, {
+    }, (0, _react2.jsx)(_Separator.default, null)), (0, _react2.jsx)(_ui.FloatingToolbarButton, {
       target: "_blank",
       href: isValidUrl ? mediaLinkingState.link : undefined,
       disabled: !isValidUrl,
@@ -85,7 +85,7 @@ var LinkToolbarAppearance = function LinkToolbarAppearance(_ref) {
     }), (0, _react2.jsx)(_Separator.default, null));
   } else {
     var _title = intl.formatMessage(_messages.linkToolbarMessages.addLink);
-    return (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_Button.default, {
+    return (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_ui.FloatingToolbarButton, {
       testId: "add-link-button",
       onClick: onAddLink,
       title: _title,

package/dist/cjs/plugins/media/ui/ImageBorder/styles.js

@@ -11,7 +11,7 @@ var _react = require("@emotion/react");
 var colors = _interopRequireWildcard(require("@atlaskit/theme/colors"));
 var _uiColor = require("@atlaskit/editor-common/ui-color");
 var _constants = require("@atlaskit/theme/constants");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7; // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
 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; }
 // menuItemDimensions and itemSpacing are copied from
@@ -21,6 +21,9 @@ var menuItemDimensions = {
   width: 175,
   height: 32
 };
+
+// TODO: Migrate away from gridSize
+// Recommendation: Replace directly with 4 due to itemSpacing being used in calculations
 exports.menuItemDimensions = menuItemDimensions;
 var itemSpacing = (0, _constants.gridSize)() / 2;
 exports.itemSpacing = itemSpacing;

package/dist/cjs/plugins/media/ui/MediaLinkingToolbar.js

@@ -20,12 +20,11 @@ var _ui = require("@atlaskit/editor-common/ui");
 var _chevronLeftLarge = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-left-large"));
 var _unlink = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/unlink"));
 var _PanelTextInput = _interopRequireDefault(require("../../../ui/PanelTextInput"));
-var _Button = _interopRequireDefault(require("../../floating-toolbar/ui/Button"));
 var _Separator = _interopRequireDefault(require("../../floating-toolbar/ui/Separator"));
 var _ToolbarComponents = require("../../../ui/LinkSearch/ToolbarComponents");
 var _LinkSearch = _interopRequireDefault(require("../../../ui/LinkSearch"));
 var _messages = require("../../../messages");
-var _utils = require("../../hyperlink/utils");
+var _utils = require("@atlaskit/editor-common/utils");
 var _colors = require("@atlaskit/theme/colors");
 var _enums = require("../../analytics/types/enums");
 var _mediaLinkingToolbarMessages = require("./media-linking-toolbar-messages");
@@ -113,7 +112,7 @@ var LinkAddToolbar = /*#__PURE__*/function (_React$PureComponent) {
         css: _ToolbarComponents.inputWrapper
       }, (0, _react2.jsx)("span", {
         css: buttonWrapper
-      }, (0, _react2.jsx)(_Button.default, {
+      }, (0, _react2.jsx)(_ui.FloatingToolbarButton, {
         title: formatLinkAddressText,
         icon: (0, _react2.jsx)(_chevronLeftLarge.default, {
           label: formatLinkAddressText
@@ -146,7 +145,7 @@ var LinkAddToolbar = /*#__PURE__*/function (_React$PureComponent) {
           _onChange(value);
         },
         onKeyDown: onKeyDown
-      }), (0, _utils.normalizeUrl)(displayUrl) && (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_Separator.default, null), (0, _react2.jsx)(_Button.default, {
+      }), (0, _utils.normalizeUrl)(displayUrl) && (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_Separator.default, null), (0, _react2.jsx)(_ui.FloatingToolbarButton, {
         title: formatUnlinkText,
         icon: (0, _react2.jsx)(_unlink.default, {
           label: formatUnlinkText

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

@@ -25,7 +25,6 @@ var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _styled = require("./styled");
 var _Resizer = _interopRequireDefault(require("../../../../ui/Resizer"));
 var _utils = require("../../../../ui/Resizer/utils");
-var _mediaSingle = require("../../utils/media-single");
 var _richMediaUtils = require("../../../../utils/rich-media-utils");
 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; } } /** @jsx jsx */
@@ -93,8 +92,9 @@ var ResizableMediaSingle = /*#__PURE__*/function (_React$Component) {
         fullWidthMode = _this$props2.fullWidthMode,
         getPos = _this$props2.getPos,
         state = _this$props2.view.state;
+      var resizedPctWidth = _this.state.resizedPctWidth;
       var pos = typeof getPos === 'function' ? getPos() : undefined;
-      return (0, _mediaSingle.calcMediaPxWidth)({
+      return (0, _ui.calcMediaPxWidth)({
         origWidth: origWidth,
         origHeight: origHeight,
         pctWidth: pctWidth,
@@ -105,7 +105,8 @@ var ResizableMediaSingle = /*#__PURE__*/function (_React$Component) {
         },
         isFullWidthModeEnabled: fullWidthMode,
         layout: useLayout || layout,
-        pos: pos
+        pos: pos,
+        resizedPctWidth: resizedPctWidth
       });
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "highlights", function (newWidth, snapPoints) {
@@ -146,13 +147,21 @@ var ResizableMediaSingle = /*#__PURE__*/function (_React$Component) {
   }
   (0, _createClass2.default)(ResizableMediaSingle, [{
     key: "componentDidUpdate",
-    value: function componentDidUpdate() {
+    value: function componentDidUpdate(prevProps) {
       var offsetLeft = calcOffsetLeft(this.insideInlineLike, this.insideLayout, this.props.view.dom, this.wrapper);
       if (offsetLeft !== this.state.offsetLeft && offsetLeft >= 0) {
         this.setState({
           offsetLeft: offsetLeft
         });
       }
+
+      // Handle undo, when the actual pctWidth changed,
+      // we sync up with the internal state.
+      if (prevProps.pctWidth !== this.props.pctWidth) {
+        this.setState({
+          resizedPctWidth: this.props.pctWidth
+        });
+      }
       return true;
     }
   }, {