@atlaskit/editor-core 188.2.0 → 188.2.3

package/dist/esm/plugins/media/styles.js

@@ -2,9 +2,9 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 var _templateObject;
 import { css } from '@emotion/react';
 import { mediaSingleSharedStyle, richMediaClassName } from '@atlaskit/editor-common/styles';
-import { akEditorDeleteBorder, akEditorDeleteBackground, akEditorSelectedBorderBoldSize, akEditorMediaResizeHandlerPaddingWide, akEditorMediaResizeHandlerPadding, akEditorSelectedNodeClassName, akEditorDeleteIconColor } from '@atlaskit/editor-shared-styles';
-import { N60, B200, Y500 } from '@atlaskit/theme/colors';
+import { akEditorDeleteBackground, akEditorDeleteBorder, akEditorDeleteIconColor, akEditorMediaResizeHandlerPadding, akEditorMediaResizeHandlerPaddingWide, akEditorSelectedBorderBoldSize, akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
 import { fileCardImageViewSelector, inlinePlayerClassName, newFileExperienceClassName } from '@atlaskit/media-card';
+import { B200, N60, Y500 } from '@atlaskit/theme/colors';
 export var mediaStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .ProseMirror {\n    ", " & [layout='full-width'] .", ",\n    & [layout='wide'] .", " {\n      margin-left: 50%;\n      transform: translateX(-50%);\n    }\n\n    .media-extended-resize-experience[layout^='wrap-'] {\n      // override 'overflow: auto' when viewport <= 410 set by mediaSingleSharedStyle\n      // to prevent scroll bar\n      overflow: visible !important;\n    }\n\n    & [layout^='wrap-'] + [layout^='wrap-'] {\n      clear: none;\n      & + p,\n      & + div[class^='fabric-editor-align'],\n      & + ul,\n      & + ol,\n      & + h1,\n      & + h2,\n      & + h3,\n      & + h4,\n      & + h5,\n      & + h6 {\n        clear: both !important;\n      }\n      & .", " {\n        margin-left: 0;\n        margin-right: 0;\n      }\n    }\n\n    .mediaSingleView-content-wrap[layout^='wrap-'] {\n      max-width: 100%;\n      // overwrite default Prosemirror setting making it clear: both\n      clear: inherit;\n    }\n\n    .mediaSingleView-content-wrap[layout='wrap-left'] {\n      float: left;\n    }\n\n    .mediaSingleView-content-wrap[layout='wrap-right'] {\n      float: right;\n    }\n\n    .mediaSingleView-content-wrap[layout='wrap-right']\n      + .mediaSingleView-content-wrap[layout='wrap-left'] {\n      clear: both;\n    }\n\n    /* Larger margins for resize handlers when at depth 0 of the document */\n    & > .mediaSingleView-content-wrap {\n      .richMedia-resize-handle-right {\n        margin-right: -", "px;\n      }\n      .richMedia-resize-handle-left {\n        margin-left: -", "px;\n      }\n    }\n  }\n\n  .richMedia-resize-handle-right,\n  .richMedia-resize-handle-left {\n    display: flex;\n    flex-direction: column;\n\n    /* vertical align */\n    justify-content: center;\n  }\n\n  .richMedia-resize-handle-right {\n    align-items: flex-end;\n    padding-right: ", ";\n    margin-right: -", "px;\n  }\n\n  .richMedia-resize-handle-left {\n    align-items: flex-start;\n    padding-left: ", ";\n    margin-left: -", "px;\n  }\n\n  .richMedia-resize-handle-right::after,\n  .richMedia-resize-handle-left::after {\n    content: ' ';\n    display: flex;\n    width: 3px;\n    height: 64px;\n\n    border-radius: 6px;\n  }\n\n  .", ":hover .richMedia-resize-handle-left::after,\n  .", ":hover .richMedia-resize-handle-right::after {\n    background: ", ";\n  }\n\n  .", " .richMedia-resize-handle-right::after,\n  .", " .richMedia-resize-handle-left::after,\n  .", " .richMedia-resize-handle-right:hover::after,\n  .", " .richMedia-resize-handle-left:hover::after,\n  .", ".is-resizing .richMedia-resize-handle-right::after,\n  .", ".is-resizing .richMedia-resize-handle-left::after {\n    background: ", ";\n  }\n\n  .__resizable_base__ {\n    left: unset !important;\n    width: auto !important;\n    height: auto !important;\n  }\n\n  /* Danger when top level node for smart cards / inline links */\n  .danger > div > div > .media-card-frame,\n  .danger > span > a {\n    background-color: ", ";\n    box-shadow: 0px 0px 0px ", "px\n      ", ";\n    transition: background-color 0s, box-shadow 0s;\n  }\n  /* Danger when nested node or common */\n  .danger {\n    /* Media single */\n    .", " .", "::after {\n      border: 1px solid ", ";\n    }\n    /* Media single video player */\n    .", " .", "::after {\n      border: 1px solid ", ";\n    }\n    /* New file experience */\n    .", " .", " {\n      box-shadow: 0 0 0 1px\n        ", " !important;\n    }\n    /* Media resize legacy handlers */\n    .richMedia-resize-handle-right::after,\n    .richMedia-resize-handle-left::after {\n      background: ", " !important;\n    }\n    /* Media resize new handlers */\n    .resizer-handle-thumb {\n      background: ", " !important;\n    }\n\n    /* Smart cards */\n    div div .media-card-frame,\n    .inlineCardView-content-wrap > span > a {\n      background-color: ", "; /* R75 with 50% opactiy */\n      transition: background-color 0s;\n    }\n\n    div div .media-card-frame::after {\n      box-shadow: none;\n    }\n  }\n\n  .warning {\n    /* Media single */\n    .", " .", "::after {\n      border: 1px solid ", ";\n    }\n\n    .", " .", "::after {\n      border: 1px solid ", ";\n    }\n\n    .", " .", " {\n      box-shadow: 0 0 0 1px ", " !important;\n    }\n\n    .resizer-handle-thumb {\n      background: ", " !important;\n    }\n  }\n"])), mediaSingleSharedStyle, richMediaClassName, richMediaClassName, richMediaClassName, akEditorMediaResizeHandlerPaddingWide, akEditorMediaResizeHandlerPaddingWide, "var(--ds-space-150, 12px)", akEditorMediaResizeHandlerPadding, "var(--ds-space-150, 12px)", akEditorMediaResizeHandlerPadding, richMediaClassName, richMediaClassName, "var(--ds-border, ".concat(N60, ")"), akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, "var(--ds-border-focused, ".concat(B200, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), akEditorSelectedBorderBoldSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), richMediaClassName, fileCardImageViewSelector, "var(--ds-border-danger, ".concat(akEditorDeleteIconColor, ")"), richMediaClassName, inlinePlayerClassName, "var(--ds-border-danger, ".concat(akEditorDeleteIconColor, ")"), richMediaClassName, newFileExperienceClassName, "var(--ds-border-danger, ".concat(akEditorDeleteIconColor, ")"), "var(--ds-icon-danger, ".concat(akEditorDeleteIconColor, ")"), "var(--ds-icon-danger, ".concat(akEditorDeleteIconColor, ")"), "var(--ds-blanket-danger, rgb(255, 189, 173, 0.5))", richMediaClassName, fileCardImageViewSelector, "var(--ds-border-warning, ".concat(Y500, ")"), richMediaClassName, inlinePlayerClassName, "var(--ds-border-warning, ".concat(Y500, ")"), richMediaClassName, newFileExperienceClassName, "var(--ds-border-warning, ".concat(Y500, ")"), "var(--ds-icon-warning, ".concat(Y500, ")"));
 
 /* `left: unset` above is to work around Chrome bug where rendering a div with

package/dist/esm/plugins/media/toolbar/alt-text.js

@@ -2,12 +2,12 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React from 'react';
+import { addAltText, ToolTipContent } from '@atlaskit/editor-common/keymaps';
 import { openMediaAltTextMenu } from '../pm-plugins/alt-text/commands';
-import { ToolTipContent, addAltText } from '@atlaskit/editor-common/keymaps';
 import { messages } from '../pm-plugins/alt-text/messages';
+import { ClassNames } from '../pm-plugins/alt-text/style';
 import AltTextEdit, { CONTAINER_WIDTH_IN_PX } from '../pm-plugins/alt-text/ui/AltTextEdit';
 import { getMediaNodeFromSelection } from '../utils/media-common';
-import { ClassNames } from '../pm-plugins/alt-text/style';
 var testId = 'alt-text-edit-button';
 export var altTextButton = function altTextButton(intl, state, editorAnalyticsAPI) {
   var mediaNode = getMediaNodeFromSelection(state);

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

@@ -1,13 +1,13 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { isNodeSelection, removeSelectedNode, safeInsert } from '@atlaskit/editor-prosemirror/utils';
 import { getMediaInputResizeAnalyticsEvent } from '../utils/analytics';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
-import { removeMediaGroupNode, getSelectedMediaSingle } from './utils';
 import { currentMediaNodeWithPos } from '../utils/current-media-node';
+import { getSelectedMediaSingle, removeMediaGroupNode } from './utils';
 export var DEFAULT_BORDER_COLOR = '#091e4224';
 export var DEFAULT_BORDER_SIZE = 2;
 export var changeInlineToMediaCard = function changeInlineToMediaCard(editorAnalyticsAPI) {

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

@@ -1,10 +1,10 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { useState } from 'react';
 import ReactDOM from 'react-dom';
-import { MediaViewer } from '@atlaskit/media-viewer';
-import { messages } from '@atlaskit/media-ui';
-import FilePreviewIcon from '@atlaskit/icon/glyph/editor/file-preview';
 import { FloatingToolbarButton as ToolbarButton } from '@atlaskit/editor-common/ui';
+import FilePreviewIcon from '@atlaskit/icon/glyph/editor/file-preview';
+import { messages } from '@atlaskit/media-ui';
+import { MediaViewer } from '@atlaskit/media-viewer';
 import { getSelectedMediaContainerNodeAttrs } from './utils';
 export var FilePreviewItem = function FilePreviewItem(_ref) {
   var mediaPluginState = _ref.mediaPluginState,

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

@@ -3,35 +3,35 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React from 'react';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { buildLayoutButtons } from '@atlaskit/editor-common/card';
+import { calcMinWidth, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH } from '@atlaskit/editor-common/media-single';
+import commonMessages from '@atlaskit/editor-common/messages';
+import { cardMessages } from '@atlaskit/editor-common/messages';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfType, hasParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
-import RemoveIcon from '@atlaskit/icon/glyph/editor/remove';
+import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
 import DownloadIcon from '@atlaskit/icon/glyph/download';
+import RemoveIcon from '@atlaskit/icon/glyph/editor/remove';
 import { mediaFilmstripItemDOMSelector } from '@atlaskit/media-filmstrip';
-import commonMessages from '@atlaskit/editor-common/messages';
-import { stateKey } from '../pm-plugins/plugin-key';
-import { getLinkingToolbar, shouldShowMediaLinkToolbar } from './linking';
-import { buildLayoutButtons } from '@atlaskit/editor-common/card';
-import { getMediaLinkingState } from '../pm-plugins/linking';
-import { getPluginState as getMediaAltTextPluginState } from '../pm-plugins/alt-text';
-import { altTextButton, getAltTextToolbar } from './alt-text';
-import { showLinkingToolbar } from '../commands/linking';
-import { LinkToolbarAppearance } from './linking-toolbar-appearance';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { messages } from '@atlaskit/media-ui';
-import { cardMessages } from '@atlaskit/editor-common/messages';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
-import { FilePreviewItem } from './filePreviewItem';
-import { downloadMedia, getSelectedMediaSingle, removeMediaGroupNode, getPixelWidthOfElement, calcNewLayout, getMaxToolbarWidth } from './utils';
-import { isVideo } from '../utils/media-single';
-import { changeInlineToMediaCard, changeMediaCardToInline, removeInlineCard, setBorderMark, toggleBorderMark, updateMediaSingleWidth } from './commands';
+import { showLinkingToolbar } from '../commands/linking';
 import { MediaInlineNodeSelector, MediaSingleNodeSelector } from '../nodeviews/styles';
+import { getPluginState as getMediaAltTextPluginState } from '../pm-plugins/alt-text';
+import { getMediaLinkingState } from '../pm-plugins/linking';
+import { stateKey } from '../pm-plugins/plugin-key';
 import ImageBorderItem from '../ui/ImageBorder';
+import { FullWidthDisplay, PixelEntry } from '../ui/PixelEntry';
 import { currentMediaNodeBorderMark } from '../utils/current-media-node';
+import { isVideo } from '../utils/media-single';
+import { altTextButton, getAltTextToolbar } from './alt-text';
+import { changeInlineToMediaCard, changeMediaCardToInline, removeInlineCard, setBorderMark, toggleBorderMark, updateMediaSingleWidth } from './commands';
+import { FilePreviewItem } from './filePreviewItem';
 import { shouldShowImageBorder } from './imageBorder';
-import { PixelEntry, FullWidthDisplay } from '../ui/PixelEntry';
-import { DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT, calcMinWidth } from '@atlaskit/editor-common/media-single';
-import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
+import { getLinkingToolbar, shouldShowMediaLinkToolbar } from './linking';
+import { LinkToolbarAppearance } from './linking-toolbar-appearance';
+import { calcNewLayout, downloadMedia, getMaxToolbarWidth, getPixelWidthOfElement, getSelectedMediaSingle, removeMediaGroupNode } from './utils';
 var remove = function remove(state, dispatch) {
   if (dispatch) {
     dispatch(removeSelectedNode(state.tr));

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

@@ -2,18 +2,17 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject;
 /** @jsx jsx */
-
-import React, { useState, useEffect, Fragment } from 'react';
+import React, { Fragment, useEffect, useState } from 'react';
 import { css, jsx } from '@emotion/react';
-import LinkIcon from '@atlaskit/icon/glyph/editor/link';
-import OpenIcon from '@atlaskit/icon/glyph/shortcut';
 import { isSafeUrl } from '@atlaskit/adf-schema';
-import { checkMediaType } from '../utils/check-media-type';
+import { addLink, ToolTipContent } from '@atlaskit/editor-common/keymaps';
+import { linkMessages, linkToolbarMessages } from '@atlaskit/editor-common/messages';
 import { FloatingToolbarButton as ToolbarButton } from '@atlaskit/editor-common/ui';
 import { FloatingToolbarSeparator as Separator } from '@atlaskit/editor-common/ui';
-import { linkMessages, linkToolbarMessages } from '@atlaskit/editor-common/messages';
-import { ToolTipContent, addLink } from '@atlaskit/editor-common/keymaps';
+import LinkIcon from '@atlaskit/icon/glyph/editor/link';
+import OpenIcon from '@atlaskit/icon/glyph/shortcut';
 import { stateKey } from '../pm-plugins/plugin-key';
+import { checkMediaType } from '../utils/check-media-type';
 import { currentMediaNode } from '../utils/current-media-node';
 // need this wrapper, need to have 4px between items.
 var wrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-right: ", ";\n"])), "var(--ds-space-050, 4px)");

package/dist/esm/plugins/media/toolbar/linking.js

@@ -2,10 +2,10 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React from 'react';
+import { RECENT_SEARCH_HEIGHT_IN_PX, RECENT_SEARCH_WIDTH_IN_PX } from '@atlaskit/editor-common/ui';
 import { hideLinkingToolbar, setUrlToMedia, unlink } from '../commands/linking';
 import { getMediaLinkingState } from '../pm-plugins/linking';
 import MediaLinkingToolbar from '../ui/MediaLinkingToolbar';
-import { RECENT_SEARCH_HEIGHT_IN_PX, RECENT_SEARCH_WIDTH_IN_PX } from '@atlaskit/editor-common/ui';
 var FORCE_FOCUS_SELECTOR = '[data-testid="add-link-button"],[data-testid="edit-link-button"]';
 export function shouldShowMediaLinkToolbar(editorState) {
   var mediaLinkingState = getMediaLinkingState(editorState);

package/dist/esm/plugins/media/toolbar/utils.js

@@ -1,9 +1,9 @@
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
-import { getMediaClient } from '@atlaskit/media-client';
-import { findParentNodeOfType, removeParentNodeOfType, removeSelectedNode, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
-import { akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
 import { wrappedLayouts } from '@atlaskit/editor-common/media-single';
+import { findParentNodeOfType, findSelectedNodeOfType, removeParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
+import { akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
+import { getMediaClient } from '@atlaskit/media-client';
 export var getSelectedMediaContainerNodeAttrs = function getSelectedMediaContainerNodeAttrs(mediaPluginState) {
   var selectedNode = mediaPluginState.selectedMediaContainerNode();
   if (selectedNode && selectedNode.attrs) {

package/dist/esm/plugins/media/ui/CaptionPlaceholder/index.js

@@ -4,9 +4,9 @@ var _templateObject;
 import React from 'react';
 import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
+import { CAPTION_PLACEHOLDER_ID } from '@atlaskit/editor-common/media-single';
 import { N200 } from '@atlaskit/theme/colors';
 import { messages } from './messages';
-import { CAPTION_PLACEHOLDER_ID } from '@atlaskit/editor-common/media-single';
 var placeholder = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: ", ";\n  width: 100%;\n  text-align: center;\n  margin-top: ", " !important;\n  display: block;\n"])), "var(--ds-text-subtlest, ".concat(N200, ")"), "var(--ds-space-100, 8px)");
 export default /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var onClick = _ref.onClick;

package/dist/esm/plugins/media/ui/ImageBorder/index.js

@@ -1,19 +1,19 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 /** @jsx jsx */
+import { useRef, useState } from 'react';
 import { jsx } from '@emotion/react';
-import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
-import { DropdownMenuSharedCssClassName } from '@atlaskit/editor-common/styles';
 import { BorderIcon } from '@atlaskit/editor-common/icons';
-import { useRef, useState } from 'react';
-import { ColorPalette, borderPaletteTooltipMessages } from '@atlaskit/editor-common/ui-color';
-import { hexToEditorBorderPaletteColor } from '@atlaskit/editor-palette';
+import { DropdownMenuSharedCssClassName } from '@atlaskit/editor-common/styles';
+import { Popup } from '@atlaskit/editor-common/ui';
+import { borderPaletteTooltipMessages, ColorPalette } from '@atlaskit/editor-common/ui-color';
 import { borderColorPalette } from '@atlaskit/editor-common/ui-color';
 import { ArrowKeyNavigationType, DropdownMenu } from '@atlaskit/editor-common/ui-menu';
-import Tooltip from '@atlaskit/tooltip';
-import { Popup } from '@atlaskit/editor-common/ui';
 import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
-import { buttonStyle, buttonWrapperStyle, contextualMenuArrow, contextualMenuColorIcon, contextualSubMenu, itemSpacing, line, menuItemDimensions, toolbarButtonWrapper } from './styles';
+import { hexToEditorBorderPaletteColor } from '@atlaskit/editor-palette';
+import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
+import Tooltip from '@atlaskit/tooltip';
 import { messages } from './messages';
+import { buttonStyle, buttonWrapperStyle, contextualMenuArrow, contextualMenuColorIcon, contextualSubMenu, itemSpacing, line, menuItemDimensions, toolbarButtonWrapper } from './styles';
 var ImageBorder = function ImageBorder(_ref) {
   var formatMessage = _ref.intl.formatMessage,
     toggleBorder = _ref.toggleBorder,

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

@@ -1,15 +1,13 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
 import { css } from '@emotion/react';
-import * as colors from '@atlaskit/theme/colors';
 import { DEFAULT_BORDER_COLOR } from '@atlaskit/editor-common/ui-color';
-import { N20A, N50, N60A, N90, N800, N0 } from '@atlaskit/theme/colors';
+import * as colors from '@atlaskit/theme/colors';
+import { N0, N20A, N50, N60A, N800, N90 } from '@atlaskit/theme/colors';
 // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
 import { gridSize } from '@atlaskit/theme/constants';
-
 // menuItemDimensions and itemSpacing are copied from
 // packages/editor/editor-core/src/plugins/floating-toolbar/ui/DropdownMenu.tsx
-
 export var menuItemDimensions = {
   width: 175,
   height: 32
@@ -18,12 +16,12 @@ export var menuItemDimensions = {
 // TODO: Migrate away from gridSize
 // Recommendation: Replace directly with 4 due to itemSpacing being used in calculations
 export var itemSpacing = gridSize() / 2;
-export var contextualMenuArrow = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  &::after {\n    content: '\u203A';\n    margin-left: 4px;\n    line-height: 20px;\n    color: ", ";\n  }\n"])), "var(--ds-icon, ".concat(N90, ")"));
+export var contextualMenuArrow = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  &::after {\n    content: '\u203A';\n    margin-left: ", ";\n    line-height: 20px;\n    color: ", ";\n  }\n"])), "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(N90, ")"));
 export var contextualMenuColorIcon = function contextualMenuColorIcon(color) {
   return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n  &::before {\n    content: '';\n    display: block;\n    border: 1px solid ", ";\n    border-radius: ", ";\n    width: 20px;\n    height: 20px;\n    ", "\n  }\n"])), contextualMenuArrow, DEFAULT_BORDER_COLOR, "var(--ds-border-radius-100, 3px)", color && "background: ".concat(color));
 };
 export var contextualSubMenu = function contextualSubMenu(index) {
-  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  border-radius: ", ";\n  background: ", ";\n  box-shadow: ", ";\n  display: flex;\n  position: absolute;\n  top: ", "px;\n  left: ", "px;\n  padding: 8px;\n\n  > div {\n    padding: 0;\n  }\n"])), "var(--ds-border-radius-100, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N60A, ", 0 0 1px ").concat(N60A), ")"), index * (menuItemDimensions.height + itemSpacing * 2), menuItemDimensions.width);
+  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  border-radius: ", ";\n  background: ", ";\n  box-shadow: ", ";\n  display: flex;\n  position: absolute;\n  top: ", "px;\n  left: ", "px;\n  padding: ", ";\n\n  > div {\n    padding: 0;\n  }\n"])), "var(--ds-border-radius-100, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N60A, ", 0 0 1px ").concat(N60A), ")"), index * (menuItemDimensions.height + itemSpacing * 2), menuItemDimensions.width, "var(--ds-space-100, 8px)");
 };
 export var buttonStyle = function buttonStyle(selected) {
   return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  height: 26px;\n  width: 26px;\n  padding: 0;\n  border-radius: 4px;\n  background-color: ", ";\n  border: 1px solid ", ";\n  cursor: pointer;\n  display: block;\n"])), selected ? "var(--ds-text, ".concat(N800, ")") : "var(--ds-background-neutral, ".concat(N20A, ")"), DEFAULT_BORDER_COLOR);

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

@@ -2,15 +2,15 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 var _templateObject, _templateObject2;
 /** @jsx jsx */
 import { css, jsx } from '@emotion/react';
-import { borderRadius } from '@atlaskit/theme/constants';
-import { B400, B300, B200 } from '@atlaskit/theme/colors';
-import DocumentFilledIcon from '@atlaskit/icon/glyph/document-filled';
-import { hexToRgba } from '@atlaskit/adf-schema';
 import { injectIntl } from 'react-intl-next';
+import { hexToRgba } from '@atlaskit/adf-schema';
+import DocumentFilledIcon from '@atlaskit/icon/glyph/document-filled';
+import { B200, B300, B400 } from '@atlaskit/theme/colors';
+import { borderRadius } from '@atlaskit/theme/constants';
+import { FILE_WIDTH, MEDIA_HEIGHT } from '../../nodeviews/mediaNodeView/media';
 import { dropPlaceholderMessages } from './drop-placeholder-messages';
-import { MEDIA_HEIGHT, FILE_WIDTH } from '../../nodeviews/mediaNodeView/media';
 var iconWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: ", ";\n  background: ", ";\n  border-radius: ", "px;\n  margin: 5px 3px 25px;\n  width: ", "px;\n  min-height: ", "px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"])), "var(--ds-icon-accent-blue, ".concat(hexToRgba(B400, 0.4) || B400, ")"), "var(--ds-background-accent-blue-subtle, ".concat(hexToRgba(B300, 0.6) || B300, ")"), borderRadius(), FILE_WIDTH, MEDIA_HEIGHT);
-var dropLine = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  background: ", ";\n  border-radius: ", "px;\n  margin: 2px 0;\n  width: 100%;\n  height: 2px;\n"])), "var(--ds-border-focused, ".concat(B200, ")"), borderRadius());
+var dropLine = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  background: ", ";\n  border-radius: ", "px;\n  margin: ", " 0;\n  width: 100%;\n  height: 2px;\n"])), "var(--ds-border-focused, ".concat(B200, ")"), borderRadius(), "var(--ds-space-025, 2px)");
 var IconWrapperComponent = function IconWrapperComponent(props) {
   var intl = props.intl;
   var dropPlaceholderLabel = dropPlaceholderMessages.dropPlaceholderLabel;

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

@@ -12,18 +12,17 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 /** @jsx jsx */
 import React, { Fragment } from 'react';
 import { css, jsx } from '@emotion/react';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { container, containerWithProvider, inputWrapper, RecentSearch } from '@atlaskit/editor-common/link';
+import { linkToolbarMessages } from '@atlaskit/editor-common/messages';
 import { ErrorMessage } from '@atlaskit/editor-common/ui';
-import ChevronLeftLargeIcon from '@atlaskit/icon/glyph/chevron-left-large';
-import EditorUnlinkIcon from '@atlaskit/icon/glyph/editor/unlink';
 // Common Translations will live here
-
 import { PanelTextInput } from '@atlaskit/editor-common/ui';
 import { FloatingToolbarButton as Button, FloatingToolbarSeparator as Separator } from '@atlaskit/editor-common/ui';
-import { container, containerWithProvider, inputWrapper, RecentSearch } from '@atlaskit/editor-common/link';
-import { linkToolbarMessages } from '@atlaskit/editor-common/messages';
 import { normalizeUrl } from '@atlaskit/editor-common/utils';
+import ChevronLeftLargeIcon from '@atlaskit/icon/glyph/chevron-left-large';
+import EditorUnlinkIcon from '@atlaskit/icon/glyph/editor/unlink';
 import { R400 } from '@atlaskit/theme/colors';
-import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { mediaLinkToolbarMessages } from './media-linking-toolbar-messages';
 var validationWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  line-height: 0;\n  padding: ", " ", "\n    ", " 0;\n  margin: 0 ", " 0 ", ";\n  border-top: 1px solid ", ";\n  align-items: start;\n  display: flex;\n  flex-direction: column;\n"])), "var(--ds-space-150, 12px)", "var(--ds-space-300, 24px)", "var(--ds-space-150, 12px)", "var(--ds-space-050, 4px)", "var(--ds-space-400, 32px)", "var(--ds-border-danger, ".concat(R400, ")"));
 var buttonWrapper = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  padding: ", " ", "\n    ", " 0px;\n"])), "var(--ds-space-050, 4px)", "var(--ds-space-100, 8px)", "var(--ds-space-050, 4px)");

package/dist/esm/plugins/media/ui/MediaPicker/BrowserWrapper.js

@@ -2,8 +2,8 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React from 'react';
-import PickerFacadeProvider from './PickerFacadeProvider';
 import { Browser } from '@atlaskit/media-picker';
+import PickerFacadeProvider from './PickerFacadeProvider';
 export var BrowserWrapper = function BrowserWrapper(_ref) {
   var mediaState = _ref.mediaState,
     isOpen = _ref.isOpen,

package/dist/esm/plugins/media/ui/MediaPicker/ClipboardWrapper.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import PickerFacadeProvider from './PickerFacadeProvider';
 import { Clipboard } from '@atlaskit/media-picker';
+import PickerFacadeProvider from './PickerFacadeProvider';
 export var ClipboardWrapper = function ClipboardWrapper(_ref) {
   var mediaState = _ref.mediaState,
     featureFlags = _ref.featureFlags,

package/dist/esm/plugins/media/ui/MediaPicker/DropzoneWrapper.js

@@ -2,9 +2,9 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React from 'react';
+import { findOverflowScrollParent } from '@atlaskit/editor-common/ui';
 import { Dropzone } from '@atlaskit/media-picker';
 import PickerFacadeProvider from './PickerFacadeProvider';
-import { findOverflowScrollParent } from '@atlaskit/editor-common/ui';
 export var DropzoneWrapper = function DropzoneWrapper(_ref) {
   var mediaState = _ref.mediaState,
     isActive = _ref.isActive,

package/dist/esm/plugins/media/ui/MediaPicker/index.js

@@ -8,10 +8,10 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(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; } }
 import React from 'react';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
+import { BrowserWrapper } from './BrowserWrapper';
 import { ClipboardWrapper } from './ClipboardWrapper';
 import { DropzoneWrapper } from './DropzoneWrapper';
-import { BrowserWrapper } from './BrowserWrapper';
-import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 var MediaPicker = function MediaPicker(_ref) {
   var api = _ref.api,
     isPopupOpened = _ref.isPopupOpened,

package/dist/esm/plugins/media/ui/PixelEntry/index.js

@@ -1,15 +1,15 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 /** @jsx jsx */
-import { jsx } from '@emotion/react';
 import { useCallback, useEffect, useMemo, useState } from 'react';
-import Textfield from '@atlaskit/textfield';
-import Tooltip from '@atlaskit/tooltip';
+import { jsx } from '@emotion/react';
 import Button from '@atlaskit/button';
 import Form, { Field } from '@atlaskit/form';
-import { pixelSizingInput, pixelSizingLabel, pixelSizingWidthInput, pixelSizingHeightInput, pixelSizingWrapper, pixelEntryForm, pixelEntryHiddenSubmit, pixelSizingFullWidthLabelStyles } from './styles';
-import { messages } from './messages';
+import Textfield from '@atlaskit/textfield';
+import Tooltip from '@atlaskit/tooltip';
 import { PIXELENTRY_MIGRATION_BUTTON_TESTID } from './constants';
+import { messages } from './messages';
+import { pixelEntryForm, pixelEntryHiddenSubmit, pixelSizingFullWidthLabelStyles, pixelSizingHeightInput, pixelSizingInput, pixelSizingLabel, pixelSizingWidthInput, pixelSizingWrapper } from './styles';
 export var PixelEntry = function PixelEntry(_ref) {
   var width = _ref.width,
     mediaWidth = _ref.mediaWidth,

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

@@ -13,22 +13,22 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 /** @jsx jsx */
 import React from 'react';
 import { jsx } from '@emotion/react';
-import { findParentNodeOfTypeClosestToPos } from '@atlaskit/editor-prosemirror/utils';
-import { calcPctFromPx, wrappedLayouts, handleSides, imageAlignmentMap } from '@atlaskit/editor-common/ui';
-import { nonWrappedLayouts, setNodeSelection } from '@atlaskit/editor-common/utils';
-import { akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorDefaultLayoutWidth } from '@atlaskit/editor-shared-styles';
-import { wrapperStyle } from './styled';
-import { ResizerNext } from '@atlaskit/editor-common/resizer';
 import classnames from 'classnames';
-import { richMediaClassName, resizerStyles } from '@atlaskit/editor-common/styles';
-import { MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH, MEDIA_SINGLE_VIDEO_MIN_PIXEL_WIDTH, MEDIA_SINGLE_SNAP_GAP, MEDIA_SINGLE_RESIZE_THROTTLE_TIME, DEFAULT_IMAGE_WIDTH, calcMediaSingleMaxWidth } from '@atlaskit/editor-common/media-single';
-import { findClosestSnap, getGuidelinesWithHighlights, generateDefaultGuidelines, generateDynamicGuidelines, getGuidelineSnaps, getGuidelineTypeFromKey, getRelativeGuideSnaps, getRelativeGuidelines } from '@atlaskit/editor-common/guideline';
-import memoizeOne from 'memoize-one';
-import { getMediaResizeAnalyticsEvent } from '../../utils/analytics';
 import throttle from 'lodash/throttle';
+import memoizeOne from 'memoize-one';
+import { findClosestSnap, generateDefaultGuidelines, generateDynamicGuidelines, getGuidelineSnaps, getGuidelinesWithHighlights, getGuidelineTypeFromKey, getRelativeGuidelines, getRelativeGuideSnaps } from '@atlaskit/editor-common/guideline';
+import { calcMediaSingleMaxWidth, DEFAULT_IMAGE_WIDTH, MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH, MEDIA_SINGLE_RESIZE_THROTTLE_TIME, MEDIA_SINGLE_SNAP_GAP, MEDIA_SINGLE_VIDEO_MIN_PIXEL_WIDTH } from '@atlaskit/editor-common/media-single';
+import { ResizerNext } from '@atlaskit/editor-common/resizer';
+import { resizerStyles, richMediaClassName } from '@atlaskit/editor-common/styles';
+import { calcPctFromPx, handleSides, imageAlignmentMap, wrappedLayouts } from '@atlaskit/editor-common/ui';
+import { nonWrappedLayouts, setNodeSelection } from '@atlaskit/editor-common/utils';
+import { findParentNodeOfTypeClosestToPos } from '@atlaskit/editor-prosemirror/utils';
+import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorGutterPadding } from '@atlaskit/editor-shared-styles';
 import { MEDIA_PLUGIN_IS_RESIZING_KEY, MEDIA_PLUGIN_RESIZING_WIDTH_KEY } from '../../pm-plugins/main';
-import { ResizableMediaMigrationNotification } from './ResizableMediaMigrationNotification';
+import { getMediaResizeAnalyticsEvent } from '../../utils/analytics';
 import { checkMediaType } from '../../utils/check-media-type';
+import { ResizableMediaMigrationNotification } from './ResizableMediaMigrationNotification';
+import { wrapperStyle } from './styled';
 export var resizerNextTestId = 'mediaSingle.resizerNext.testid';
 var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
   _inherits(ResizableMediaSingleNext, _React$Component);
@@ -498,6 +498,9 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       // set undefined to fall back to 100%
       undefined : this.calcMaxWidth(lineLength, containerWidth, fullWidthMode);
       var minWidth = this.calcMinWidth(isVideoFile, lineLength);
+
+      // while is not resizing, we take 100% as min-width if the container width is less than the min-width
+      var minViewWidth = isResizing ? minWidth : "min(".concat(minWidth, "px, 100%)");
       return jsx("div", {
         css: wrapperStyle({
           layout: layout,
@@ -508,7 +511,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
           isExtendedResizeExperienceOn: true
         })
       }, jsx(ResizerNext, {
-        minWidth: minWidth,
+        minWidth: minViewWidth,
         maxWidth: maxWidth,
         className: resizerNextClassName,
         snapGap: MEDIA_SINGLE_SNAP_GAP,

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

@@ -13,13 +13,13 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 /** @jsx jsx */
 import React from 'react';
 import { jsx } from '@emotion/react';
-import { findParentNodeOfTypeClosestToPos, hasParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
-import { calcPctFromPx, calcColumnsFromPx, wrappedLayouts, Resizer, calcMediaPxWidth, snapTo, handleSides, imageAlignmentMap } from '@atlaskit/editor-common/ui';
-import { akEditorWideLayoutWidth } from '@atlaskit/editor-shared-styles';
-import { wrapperStyle } from './styled';
 import { calculateOffsetLeft } from '@atlaskit/editor-common/media-single';
+import { calcColumnsFromPx, calcMediaPxWidth, calcPctFromPx, handleSides, imageAlignmentMap, Resizer, snapTo, wrappedLayouts } from '@atlaskit/editor-common/ui';
 import { calculateSnapPoints } from '@atlaskit/editor-common/utils';
+import { findParentNodeOfTypeClosestToPos, hasParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
+import { akEditorWideLayoutWidth } from '@atlaskit/editor-shared-styles';
 import { checkMediaType } from '../../utils/check-media-type';
+import { wrapperStyle } from './styled';
 var ResizableMediaSingle = /*#__PURE__*/function (_React$Component) {
   _inherits(ResizableMediaSingle, _React$Component);
   var _super = _createSuper(ResizableMediaSingle);

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

@@ -1,9 +1,9 @@
 import React from 'react';
+import { injectIntl } from 'react-intl-next';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
+import { TOOLBAR_BUTTON, ToolbarButton } from '@atlaskit/editor-common/ui-menu';
 import AttachmentIcon from '@atlaskit/icon/glyph/editor/attachment';
-import { ToolbarButton, TOOLBAR_BUTTON } from '@atlaskit/editor-common/ui-menu';
 import { toolbarMediaMessages } from './toolbar-media-messages';
-import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
-import { injectIntl } from 'react-intl-next';
 var onClickMediaButton = function onClickMediaButton(pluginState) {
   return function () {
     pluginState.showMediaPicker();

package/dist/esm/plugins/media/utils/media-files.js

@@ -1,9 +1,9 @@
-import { Fragment } from '@atlaskit/editor-prosemirror/model';
-import { findFarthestParentNode, insideTableCell, isInLayoutColumn, isInListItem, isSupportedInParent, setNodeSelection, setTextSelection } from '@atlaskit/editor-common/utils';
-import { posOfPrecedingMediaGroup, posOfMediaGroupNearby, posOfParentMediaGroup, isSelectionNonMediaBlockNode, isInsidePotentialEmptyParagraph, copyOptionalAttrsFromMediaState } from './media-common';
-import { canInsert, safeInsert, hasParentNode } from '@atlaskit/editor-prosemirror/utils';
-import { atTheBeginningOfBlock, atTheEndOfBlock, atTheEndOfDoc, endPositionOfParent, startPositionOfParent } from '@atlaskit/editor-common/selection';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { atTheBeginningOfBlock, atTheEndOfBlock, atTheEndOfDoc, endPositionOfParent, startPositionOfParent } from '@atlaskit/editor-common/selection';
+import { findFarthestParentNode, insideTableCell, isInLayoutColumn, isInListItem, isSupportedInParent, setNodeSelection, setTextSelection } from '@atlaskit/editor-common/utils';
+import { Fragment } from '@atlaskit/editor-prosemirror/model';
+import { canInsert, hasParentNode, safeInsert } from '@atlaskit/editor-prosemirror/utils';
+import { copyOptionalAttrsFromMediaState, isInsidePotentialEmptyParagraph, isSelectionNonMediaBlockNode, posOfMediaGroupNearby, posOfParentMediaGroup, posOfPrecedingMediaGroup } from './media-common';
 export var canInsertMediaInline = function canInsertMediaInline(state) {
   var node = state.schema.nodes.mediaInline.create({});
   return canInsert(state.selection.$to, Fragment.from(node));

package/dist/esm/plugins/media/utils/media-single.js

@@ -1,15 +1,15 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { safeInsert, shouldSplitSelectedNodeOnNodeInsertion } from '@atlaskit/editor-common/insert';
 import { getMaxWidthForNestedNodeNext, getMediaSingleInitialWidth, MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH, MEDIA_SINGLE_VIDEO_MIN_PIXEL_WIDTH } from '@atlaskit/editor-common/media-single';
+import { atTheBeginningOfBlock } from '@atlaskit/editor-common/selection';
 import { checkNodeDown, isEmptyParagraph } from '@atlaskit/editor-common/utils';
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
 import { safeInsert as pmSafeInsert } from '@atlaskit/editor-prosemirror/utils';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
-import { safeInsert, shouldSplitSelectedNodeOnNodeInsertion } from '@atlaskit/editor-common/insert';
-import { copyOptionalAttrsFromMediaState } from '../utils/media-common';
-import { atTheBeginningOfBlock } from '@atlaskit/editor-common/selection';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
+import { copyOptionalAttrsFromMediaState } from '../utils/media-common';
 import { isImage } from './is-image';
 var getInsertMediaAnalytics = function getInsertMediaAnalytics(inputMethod, fileExtension) {
   return {

package/dist/esm/plugins/selection/gap-cursor/utils/place-gap-cursor.js

@@ -50,7 +50,9 @@ var measureValue = function measureValue(style, measureValues) {
   return result;
 };
 var mutateElementStyle = function mutateElementStyle(element, style, side) {
+  element.style.transform = style.getPropertyValue('transform');
   if (isLeftCursor(side)) {
+    element.style.width = style.getPropertyValue('width');
     element.style.marginLeft = style.getPropertyValue('margin-left');
   } else {
     var marginRight = parseFloat(style.getPropertyValue('margin-right'));

package/dist/esm/version-wrapper.js

@@ -1,5 +1,5 @@
 export var name = "@atlaskit/editor-core";
-export var version = "188.2.0";
+export var version = "188.2.3";
 export var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/types/plugins/media/commands/captions.d.ts

@@ -1,5 +1,5 @@
-import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import type { Command } from '@atlaskit/editor-common/types';
 import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+import type { Command } from '@atlaskit/editor-common/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 export declare const selectCaptionFromMediaSinglePos: (mediaSingleNodePos: number, mediaSingleNode: PMNode) => Command;
 export declare const insertAndSelectCaptionFromMediaSinglePos: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => (mediaSingleNodePos: number | undefined, mediaSingleNode: PMNode) => Command;

package/dist/types/plugins/media/commands/helpers.d.ts

@@ -1,6 +1,6 @@
 import type { Command } from '@atlaskit/editor-common/types';
-import type { MediaNodeWithPosHandler, MediaPluginState } from '../pm-plugins/types';
 import type { EditorState } from '@atlaskit/editor-prosemirror/state';
+import type { MediaNodeWithPosHandler, MediaPluginState } from '../pm-plugins/types';
 /**
  * Note that Media Inline is inserted like a media single node into the media plugin state.
  * Though it is not of type mediaSingle, it shares the same `findMediaSingleNode` method

package/dist/types/plugins/media/commands/linking.d.ts

@@ -1,7 +1,7 @@
-import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { EditorAnalyticsAPI, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { Command, CommandDispatch } from '@atlaskit/editor-common/types';
 import type { EditorState } from '@atlaskit/editor-prosemirror/state';
-import type { INPUT_METHOD, EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 export declare const showLinkingToolbar: Command;
 export declare const showLinkingToolbarWithMediaTypeCheck: Command;
 export declare const hideLinkingToolbar: (state: EditorState, dispatch?: CommandDispatch, view?: EditorView, focusFloatingToolbar?: boolean) => void;

package/dist/types/plugins/media/index.d.ts

@@ -1,8 +1,8 @@
 import type { MediaProvider } from '@atlaskit/editor-common/provider-factory';
+import type { MediaNextEditorPluginType } from './next-plugin-type';
 import type { MediaState } from './pm-plugins/main';
 import type { CustomMediaPicker } from './types';
 export type { MediaState, MediaProvider, CustomMediaPicker };
 export { insertMediaSingleNode } from './utils/media-single';
-import type { MediaNextEditorPluginType } from './next-plugin-type';
 declare const mediaPlugin: MediaNextEditorPluginType;
 export default mediaPlugin;

package/dist/types/plugins/media/media-plugin-options.d.ts

@@ -1,8 +1,8 @@
-import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import type { EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
 import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import type { ErrorReporter } from '@atlaskit/editor-common/utils';
-import type { MediaState, CustomMediaPicker, getPosHandler } from './types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
+import type { CustomMediaPicker, getPosHandler, MediaState } from './types';
 export type MediaPluginOptions = {
     providerFactory: ProviderFactory;
     nodeViews: {