@atlaskit/editor-core 187.48.2 → 187.48.5

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

@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _providerFactory = require("@atlaskit/editor-common/provider-factory");
-var _pluginKey = require("../media/pm-plugins/plugin-key");
 var _utils = require("../type-ahead/utils");
 var _layout = require("../layout");
 var _macro = require("../macro");
@@ -16,8 +15,8 @@ var _ToolbarInsertBlock = _interopRequireDefault(require("./ui/ToolbarInsertBloc
 var _key = require("../type-ahead/pm-plugins/key");
 var _consts = require("@atlaskit/editor-plugin-block-type/consts");
 var _analytics = require("../analytics");
-var _pluginKey2 = require("../placeholder-text/plugin-key");
-var _pluginKey3 = require("../macro/plugin-key");
+var _pluginKey = require("../placeholder-text/plugin-key");
+var _pluginKey2 = require("../macro/plugin-key");
 var _types = require("../../ui/Toolbar/types");
 var _hooks = require("@atlaskit/editor-common/hooks");
 var toolbarSizeToButtons = function toolbarSizeToButtons(toolbarSize) {
@@ -79,14 +78,12 @@ var insertBlockPlugin = function insertBlockPlugin(_ref) {
         return /*#__PURE__*/_react.default.createElement(_WithPluginState.default, {
           plugins: {
             typeAheadState: _key.pluginKey,
-            mediaState: _pluginKey.stateKey,
-            macroState: _pluginKey3.pluginKey,
-            placeholderTextState: _pluginKey2.pluginKey,
+            macroState: _pluginKey2.pluginKey,
+            placeholderTextState: _pluginKey.pluginKey,
             layoutState: _layout.pluginKey
           },
           render: function render(_ref3) {
-            var mediaState = _ref3.mediaState,
-              _ref3$macroState = _ref3.macroState,
+            var _ref3$macroState = _ref3.macroState,
               macroState = _ref3$macroState === void 0 ? {} : _ref3$macroState,
               placeholderTextState = _ref3.placeholderTextState,
               layoutState = _ref3.layoutState;
@@ -104,7 +101,6 @@ var insertBlockPlugin = function insertBlockPlugin(_ref) {
               isToolbarReducedSpacing: isToolbarReducedSpacing,
               isLastItem: isLastItem,
               featureFlags: featureFlags,
-              mediaState: mediaState,
               macroState: macroState,
               placeholderTextState: placeholderTextState,
               layoutState: layoutState,
@@ -123,7 +119,7 @@ var insertBlockPlugin = function insertBlockPlugin(_ref) {
   };
 };
 function ToolbarInsertBlockWithInjectionApi(_ref4) {
-  var _pluginInjectionApi$i, _pluginInjectionApi$c, _pluginInjectionApi$p, _pluginInjectionApi$b;
+  var _ref5, _ref6, _pluginInjectionApi$i, _pluginInjectionApi$c, _pluginInjectionApi$p, _pluginInjectionApi$b;
   var editorView = _ref4.editorView,
     editorActions = _ref4.editorActions,
     dispatchAnalyticsEvent = _ref4.dispatchAnalyticsEvent,
@@ -137,19 +133,19 @@ function ToolbarInsertBlockWithInjectionApi(_ref4) {
     providers = _ref4.providers,
     pluginInjectionApi = _ref4.pluginInjectionApi,
     options = _ref4.options,
-    mediaState = _ref4.mediaState,
     macroState = _ref4.macroState,
     placeholderTextState = _ref4.placeholderTextState,
     layoutState = _ref4.layoutState,
     featureFlags = _ref4.featureFlags;
   var buttons = toolbarSizeToButtons(toolbarSize);
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['hyperlink', 'date', 'imageUpload', 'mention', 'emoji', 'blockType']),
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['hyperlink', 'date', 'imageUpload', 'mention', 'emoji', 'blockType', 'media']),
     dateState = _useSharedPluginState.dateState,
     hyperlinkState = _useSharedPluginState.hyperlinkState,
     imageUploadState = _useSharedPluginState.imageUploadState,
     mentionState = _useSharedPluginState.mentionState,
     emojiState = _useSharedPluginState.emojiState,
-    blockTypeState = _useSharedPluginState.blockTypeState;
+    blockTypeState = _useSharedPluginState.blockTypeState,
+    mediaState = _useSharedPluginState.mediaState;
   return /*#__PURE__*/_react.default.createElement(_ToolbarInsertBlock.default, {
     pluginInjectionApi: pluginInjectionApi,
     buttons: buttons,
@@ -166,8 +162,8 @@ function ToolbarInsertBlockWithInjectionApi(_ref4) {
     placeholderTextEnabled: placeholderTextState && placeholderTextState.allowInserting,
     layoutSectionEnabled: !!layoutState,
     expandEnabled: !!options.allowExpand,
-    mediaUploadsEnabled: mediaState && mediaState.allowsUploads,
-    onShowMediaPicker: mediaState && mediaState.showMediaPicker,
+    mediaUploadsEnabled: (_ref5 = mediaState && mediaState.allowsUploads) !== null && _ref5 !== void 0 ? _ref5 : undefined,
+    onShowMediaPicker: (_ref6 = mediaState && mediaState.showMediaPicker) !== null && _ref6 !== void 0 ? _ref6 : undefined,
     mediaSupported: !!mediaState,
     imageUploadSupported: !!(pluginInjectionApi !== null && pluginInjectionApi !== void 0 && pluginInjectionApi.imageUpload),
     imageUploadEnabled: imageUploadState === null || imageUploadState === void 0 ? void 0 : imageUploadState.enabled,

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

@@ -21,6 +21,7 @@ var _picker = require("@atlaskit/emoji/picker");
 var _ui = require("@atlaskit/editor-common/ui");
 var _ToolbarButton = _interopRequireDefault(require("../../../../ui/ToolbarButton"));
 var _styles = require("@atlaskit/editor-common/styles");
+var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _actions = require("../../../date/actions");
 var _actions2 = require("../../../placeholder-text/actions");
 var _actions3 = require("../../../layout/actions");
@@ -438,7 +439,8 @@ var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
         mountTo: popupsMountPoint,
         boundariesElement: popupsBoundariesElement,
         scrollableElement: popupsScrollableElement,
-        focusTrap: true
+        focusTrap: true,
+        zIndex: _editorSharedStyles.akEditorMenuZIndex
       }, (0, _react2.jsx)(EmojiPickerWithListeners, {
         emojiProvider: emojiProvider,
         onSelection: this.handleSelectedEmoji,

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

@@ -10,14 +10,14 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _keymap2 = require("@atlaskit/editor-prosemirror/keymap");
 var _keymaps = require("@atlaskit/editor-common/keymaps");
 var _analytics = require("@atlaskit/editor-common/analytics");
-var _pluginKey = require("../../plugins/media/pm-plugins/plugin-key");
 var _consts = require("../analytics/consts");
-function createPlugin(eventDispatch, onSave) {
+function createPlugin(eventDispatch, api, onSave) {
   if (!onSave) {
     return;
   }
   return (0, _keymap2.keymap)((0, _defineProperty2.default)({}, "".concat(_keymaps.submit.common), function _(state, _dispatch, editorView) {
-    var mediaState = _pluginKey.stateKey.getState(state);
+    var _api$media, _api$media$sharedStat;
+    var mediaState = api === null || api === void 0 ? void 0 : (_api$media = api.media) === null || _api$media === void 0 ? void 0 : (_api$media$sharedStat = _api$media.sharedState) === null || _api$media$sharedStat === void 0 ? void 0 : _api$media$sharedStat.currentState();
     if (mediaState && mediaState.waitForMediaUpload && !mediaState.allUploadsFinished) {
       return true;
     }
@@ -46,7 +46,8 @@ var analyticsPayload = function analyticsPayload(state) {
   };
 };
 var submitEditorPlugin = function submitEditorPlugin(_ref) {
-  var onSave = _ref.config;
+  var onSave = _ref.config,
+    api = _ref.api;
   return {
     name: 'submitEditor',
     pmPlugins: function pmPlugins() {
@@ -54,7 +55,7 @@ var submitEditorPlugin = function submitEditorPlugin(_ref) {
         name: 'submitEditor',
         plugin: function plugin(_ref2) {
           var dispatch = _ref2.dispatch;
-          return createPlugin(dispatch, onSave);
+          return createPlugin(dispatch, api, onSave);
         }
       }];
     }

package/dist/cjs/ui/Appearance/Comment/Comment.js

@@ -1,6 +1,7 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -13,7 +14,7 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
 var _buttonGroup = _interopRequireDefault(require("@atlaskit/button/button-group"));
 var _customThemeButton = _interopRequireDefault(require("@atlaskit/button/custom-theme-button"));
@@ -21,9 +22,6 @@ var _constants = require("@atlaskit/theme/constants");
 var _colors = require("@atlaskit/theme/colors");
 var _Toolbar = _interopRequireDefault(require("../../Toolbar"));
 var _PluginSlot = _interopRequireDefault(require("../../PluginSlot"));
-var _WithPluginState = _interopRequireDefault(require("../../WithPluginState"));
-var _maxContentSize = require("../../../plugins/max-content-size");
-var _pluginKey = require("../../../plugins/media/pm-plugins/plugin-key");
 var _Addon = require("../../Addon");
 var _commonStyles = require("@atlaskit/editor-plugin-table/ui/common-styles");
 var _WithFlash = _interopRequireDefault(require("../../WithFlash"));
@@ -34,11 +32,15 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _reactIntlNext = require("react-intl-next");
 var _messages = _interopRequireDefault(require("../../../messages"));
+var _context = require("../../../presets/context");
 var _Toolbar2 = require("./Toolbar");
 var _ContentStyles = require("../../ContentStyles");
 var _uiMenu = require("@atlaskit/editor-common/ui-menu");
+var _hooks = require("@atlaskit/editor-common/hooks");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 /** @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); }
+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; }
 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; } }
 var CommentEditorMargin = 14;
@@ -195,17 +197,24 @@ var Editor = /*#__PURE__*/function (_React$Component) {
   (0, _createClass2.default)(Editor, [{
     key: "render",
     value: function render() {
-      return (0, _react2.jsx)(_WithPluginState.default, {
-        plugins: {
-          maxContentSize: _maxContentSize.pluginKey,
-          mediaState: _pluginKey.stateKey
-        },
-        render: this.renderChrome
+      return (0, _react2.jsx)(RenderWithPluginState, {
+        renderChrome: this.renderChrome
       });
     }
   }]);
   return Editor;
 }(_react.default.Component);
 (0, _defineProperty2.default)(Editor, "displayName", 'CommentEditorAppearance');
+function RenderWithPluginState(_ref4) {
+  var renderChrome = _ref4.renderChrome;
+  var api = (0, _context.usePresetContext)();
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['media', 'maxContentSize']),
+    mediaState = _useSharedPluginState.mediaState,
+    maxContentSizeState = _useSharedPluginState.maxContentSizeState;
+  return (0, _react2.jsx)(_react.Fragment, null, renderChrome({
+    maxContentSize: maxContentSizeState,
+    mediaState: mediaState
+  }));
+}
 var CommentEditorWithIntl = (0, _reactIntlNext.injectIntl)(Editor);
 exports.CommentEditorWithIntl = CommentEditorWithIntl;

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.48.2";
+var version = "187.48.5";
 exports.version = version;
 var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');

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

@@ -1,6 +1,5 @@
 import React from 'react';
 import { WithProviders } from '@atlaskit/editor-common/provider-factory';
-import { stateKey as mediaStateKey } from '../media/pm-plugins/plugin-key';
 import { isTypeAheadAllowed } from '../type-ahead/utils';
 import { pluginKey as layoutStateKey } from '../layout';
 import { insertMacroFromMacroBrowser } from '../macro';
@@ -71,13 +70,11 @@ const insertBlockPlugin = ({
         return /*#__PURE__*/React.createElement(WithPluginState, {
           plugins: {
             typeAheadState: typeAheadPluginKey,
-            mediaState: mediaStateKey,
             macroState: macroStateKey,
             placeholderTextState: placeholderTextStateKey,
             layoutState: layoutStateKey
           },
           render: ({
-            mediaState,
             macroState = {},
             placeholderTextState,
             layoutState
@@ -96,7 +93,6 @@ const insertBlockPlugin = ({
               isToolbarReducedSpacing: isToolbarReducedSpacing,
               isLastItem: isLastItem,
               featureFlags: featureFlags,
-              mediaState: mediaState,
               macroState: macroState,
               placeholderTextState: placeholderTextState,
               layoutState: layoutState,
@@ -128,13 +124,12 @@ function ToolbarInsertBlockWithInjectionApi({
   providers,
   pluginInjectionApi,
   options,
-  mediaState,
   macroState,
   placeholderTextState,
   layoutState,
   featureFlags
 }) {
-  var _pluginInjectionApi$i, _pluginInjectionApi$c, _pluginInjectionApi$p, _pluginInjectionApi$b;
+  var _ref, _ref2, _pluginInjectionApi$i, _pluginInjectionApi$c, _pluginInjectionApi$p, _pluginInjectionApi$b;
   const buttons = toolbarSizeToButtons(toolbarSize);
   const {
     dateState,
@@ -142,8 +137,9 @@ function ToolbarInsertBlockWithInjectionApi({
     imageUploadState,
     mentionState,
     emojiState,
-    blockTypeState
-  } = useSharedPluginState(pluginInjectionApi, ['hyperlink', 'date', 'imageUpload', 'mention', 'emoji', 'blockType']);
+    blockTypeState,
+    mediaState
+  } = useSharedPluginState(pluginInjectionApi, ['hyperlink', 'date', 'imageUpload', 'mention', 'emoji', 'blockType', 'media']);
   return /*#__PURE__*/React.createElement(ToolbarInsertBlock, {
     pluginInjectionApi: pluginInjectionApi,
     buttons: buttons,
@@ -160,8 +156,8 @@ function ToolbarInsertBlockWithInjectionApi({
     placeholderTextEnabled: placeholderTextState && placeholderTextState.allowInserting,
     layoutSectionEnabled: !!layoutState,
     expandEnabled: !!options.allowExpand,
-    mediaUploadsEnabled: mediaState && mediaState.allowsUploads,
-    onShowMediaPicker: mediaState && mediaState.showMediaPicker,
+    mediaUploadsEnabled: (_ref = mediaState && mediaState.allowsUploads) !== null && _ref !== void 0 ? _ref : undefined,
+    onShowMediaPicker: (_ref2 = mediaState && mediaState.showMediaPicker) !== null && _ref2 !== void 0 ? _ref2 : undefined,
     mediaSupported: !!mediaState,
     imageUploadSupported: !!(pluginInjectionApi !== null && pluginInjectionApi !== void 0 && pluginInjectionApi.imageUpload),
     imageUploadEnabled: imageUploadState === null || imageUploadState === void 0 ? void 0 : imageUploadState.enabled,

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

@@ -8,6 +8,7 @@ import { EmojiPicker as AkEmojiPicker } from '@atlaskit/emoji/picker';
 import { Popup } from '@atlaskit/editor-common/ui';
 import ToolbarButton from '../../../../ui/ToolbarButton';
 import { separatorStyles, buttonGroupStyle, wrapperStyle } from '@atlaskit/editor-common/styles';
+import { akEditorMenuZIndex } from '@atlaskit/editor-shared-styles';
 import { insertDate } from '../../../date/actions';
 import { showPlaceholderFloatingToolbar } from '../../../placeholder-text/actions';
 import { insertLayoutColumnsWithAnalytics } from '../../../layout/actions';
@@ -481,7 +482,8 @@ export class ToolbarInsertBlock extends React.PureComponent {
       mountTo: popupsMountPoint,
       boundariesElement: popupsBoundariesElement,
       scrollableElement: popupsScrollableElement,
-      focusTrap: true
+      focusTrap: true,
+      zIndex: akEditorMenuZIndex
     }, jsx(EmojiPickerWithListeners, {
       emojiProvider: emojiProvider,
       onSelection: this.handleSelectedEmoji,

package/dist/es2019/plugins/submit-editor/index.js

@@ -1,15 +1,15 @@
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
 import { submit } from '@atlaskit/editor-common/keymaps';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { stateKey as mediaPluginKey } from '../../plugins/media/pm-plugins/plugin-key';
 import { analyticsEventKey } from '../analytics/consts';
-export function createPlugin(eventDispatch, onSave) {
+export function createPlugin(eventDispatch, api, onSave) {
   if (!onSave) {
     return;
   }
   return keymap({
     [`${submit.common}`]: (state, _dispatch, editorView) => {
-      const mediaState = mediaPluginKey.getState(state);
+      var _api$media, _api$media$sharedStat;
+      const mediaState = api === null || api === void 0 ? void 0 : (_api$media = api.media) === null || _api$media === void 0 ? void 0 : (_api$media$sharedStat = _api$media.sharedState) === null || _api$media$sharedStat === void 0 ? void 0 : _api$media$sharedStat.currentState();
       if (mediaState && mediaState.waitForMediaUpload && !mediaState.allUploadsFinished) {
         return true;
       }
@@ -37,7 +37,8 @@ const analyticsPayload = state => ({
   }
 });
 const submitEditorPlugin = ({
-  config: onSave
+  config: onSave,
+  api
 }) => ({
   name: 'submitEditor',
   pmPlugins() {
@@ -45,7 +46,7 @@ const submitEditorPlugin = ({
       name: 'submitEditor',
       plugin: ({
         dispatch
-      }) => createPlugin(dispatch, onSave)
+      }) => createPlugin(dispatch, api, onSave)
     }];
   }
 });

package/dist/es2019/ui/Appearance/Comment/Comment.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /** @jsx jsx */
-import React from 'react';
+import React, { Fragment } from 'react';
 import { css, jsx } from '@emotion/react';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/custom-theme-button';
@@ -8,9 +8,6 @@ import { borderRadius } from '@atlaskit/theme/constants';
 import { N40 } from '@atlaskit/theme/colors';
 import Toolbar from '../../Toolbar';
 import PluginSlot from '../../PluginSlot';
-import WithPluginState from '../../WithPluginState';
-import { pluginKey as maxContentSizePluginKey } from '../../../plugins/max-content-size';
-import { stateKey as mediaPluginKey } from '../../../plugins/media/pm-plugins/plugin-key';
 import { ClickAreaBlock } from '../../Addon';
 import { tableCommentEditorStyles } from '@atlaskit/editor-plugin-table/ui/common-styles';
 import WithFlash from '../../WithFlash';
@@ -21,9 +18,11 @@ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import classnames from 'classnames';
 import { injectIntl } from 'react-intl-next';
 import messages from '../../../messages';
+import { usePresetContext } from '../../../presets/context';
 import { TableControlsPadding, MainToolbar, mainToolbarCustomComponentsSlotStyle } from './Toolbar';
 import { createEditorContentStyle } from '../../ContentStyles';
 import { ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 const CommentEditorMargin = 14;
 const commentEditorStyle = css`
   display: flex;
@@ -223,14 +222,23 @@ class Editor extends React.Component {
     }
   }
   render() {
-    return jsx(WithPluginState, {
-      plugins: {
-        maxContentSize: maxContentSizePluginKey,
-        mediaState: mediaPluginKey
-      },
-      render: this.renderChrome
+    return jsx(RenderWithPluginState, {
+      renderChrome: this.renderChrome
     });
   }
 }
 _defineProperty(Editor, "displayName", 'CommentEditorAppearance');
+function RenderWithPluginState({
+  renderChrome
+}) {
+  const api = usePresetContext();
+  const {
+    mediaState,
+    maxContentSizeState
+  } = useSharedPluginState(api, ['media', 'maxContentSize']);
+  return jsx(Fragment, null, renderChrome({
+    maxContentSize: maxContentSizeState,
+    mediaState
+  }));
+}
 export const CommentEditorWithIntl = injectIntl(Editor);

package/dist/es2019/version-wrapper.js

@@ -1,5 +1,5 @@
 export const name = "@atlaskit/editor-core";
-export const version = "187.48.2";
+export const version = "187.48.5";
 export const nextMajorVersion = () => {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/esm/plugins/insert-block/index.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import { WithProviders } from '@atlaskit/editor-common/provider-factory';
-import { stateKey as mediaStateKey } from '../media/pm-plugins/plugin-key';
 import { isTypeAheadAllowed } from '../type-ahead/utils';
 import { pluginKey as layoutStateKey } from '../layout';
 import { insertMacroFromMacroBrowser } from '../macro';
@@ -72,14 +71,12 @@ var insertBlockPlugin = function insertBlockPlugin(_ref) {
         return /*#__PURE__*/React.createElement(WithPluginState, {
           plugins: {
             typeAheadState: typeAheadPluginKey,
-            mediaState: mediaStateKey,
             macroState: macroStateKey,
             placeholderTextState: placeholderTextStateKey,
             layoutState: layoutStateKey
           },
           render: function render(_ref3) {
-            var mediaState = _ref3.mediaState,
-              _ref3$macroState = _ref3.macroState,
+            var _ref3$macroState = _ref3.macroState,
               macroState = _ref3$macroState === void 0 ? {} : _ref3$macroState,
               placeholderTextState = _ref3.placeholderTextState,
               layoutState = _ref3.layoutState;
@@ -97,7 +94,6 @@ var insertBlockPlugin = function insertBlockPlugin(_ref) {
               isToolbarReducedSpacing: isToolbarReducedSpacing,
               isLastItem: isLastItem,
               featureFlags: featureFlags,
-              mediaState: mediaState,
               macroState: macroState,
               placeholderTextState: placeholderTextState,
               layoutState: layoutState,
@@ -116,7 +112,7 @@ var insertBlockPlugin = function insertBlockPlugin(_ref) {
   };
 };
 function ToolbarInsertBlockWithInjectionApi(_ref4) {
-  var _pluginInjectionApi$i, _pluginInjectionApi$c, _pluginInjectionApi$p, _pluginInjectionApi$b;
+  var _ref5, _ref6, _pluginInjectionApi$i, _pluginInjectionApi$c, _pluginInjectionApi$p, _pluginInjectionApi$b;
   var editorView = _ref4.editorView,
     editorActions = _ref4.editorActions,
     dispatchAnalyticsEvent = _ref4.dispatchAnalyticsEvent,
@@ -130,19 +126,19 @@ function ToolbarInsertBlockWithInjectionApi(_ref4) {
     providers = _ref4.providers,
     pluginInjectionApi = _ref4.pluginInjectionApi,
     options = _ref4.options,
-    mediaState = _ref4.mediaState,
     macroState = _ref4.macroState,
     placeholderTextState = _ref4.placeholderTextState,
     layoutState = _ref4.layoutState,
     featureFlags = _ref4.featureFlags;
   var buttons = toolbarSizeToButtons(toolbarSize);
-  var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['hyperlink', 'date', 'imageUpload', 'mention', 'emoji', 'blockType']),
+  var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['hyperlink', 'date', 'imageUpload', 'mention', 'emoji', 'blockType', 'media']),
     dateState = _useSharedPluginState.dateState,
     hyperlinkState = _useSharedPluginState.hyperlinkState,
     imageUploadState = _useSharedPluginState.imageUploadState,
     mentionState = _useSharedPluginState.mentionState,
     emojiState = _useSharedPluginState.emojiState,
-    blockTypeState = _useSharedPluginState.blockTypeState;
+    blockTypeState = _useSharedPluginState.blockTypeState,
+    mediaState = _useSharedPluginState.mediaState;
   return /*#__PURE__*/React.createElement(ToolbarInsertBlock, {
     pluginInjectionApi: pluginInjectionApi,
     buttons: buttons,
@@ -159,8 +155,8 @@ function ToolbarInsertBlockWithInjectionApi(_ref4) {
     placeholderTextEnabled: placeholderTextState && placeholderTextState.allowInserting,
     layoutSectionEnabled: !!layoutState,
     expandEnabled: !!options.allowExpand,
-    mediaUploadsEnabled: mediaState && mediaState.allowsUploads,
-    onShowMediaPicker: mediaState && mediaState.showMediaPicker,
+    mediaUploadsEnabled: (_ref5 = mediaState && mediaState.allowsUploads) !== null && _ref5 !== void 0 ? _ref5 : undefined,
+    onShowMediaPicker: (_ref6 = mediaState && mediaState.showMediaPicker) !== null && _ref6 !== void 0 ? _ref6 : undefined,
     mediaSupported: !!mediaState,
     imageUploadSupported: !!(pluginInjectionApi !== null && pluginInjectionApi !== void 0 && pluginInjectionApi.imageUpload),
     imageUploadEnabled: imageUploadState === null || imageUploadState === void 0 ? void 0 : imageUploadState.enabled,

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

@@ -19,6 +19,7 @@ import { EmojiPicker as AkEmojiPicker } from '@atlaskit/emoji/picker';
 import { Popup } from '@atlaskit/editor-common/ui';
 import ToolbarButton from '../../../../ui/ToolbarButton';
 import { separatorStyles, buttonGroupStyle, wrapperStyle } from '@atlaskit/editor-common/styles';
+import { akEditorMenuZIndex } from '@atlaskit/editor-shared-styles';
 import { insertDate } from '../../../date/actions';
 import { showPlaceholderFloatingToolbar } from '../../../placeholder-text/actions';
 import { insertLayoutColumnsWithAnalytics } from '../../../layout/actions';
@@ -433,7 +434,8 @@ export var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
         mountTo: popupsMountPoint,
         boundariesElement: popupsBoundariesElement,
         scrollableElement: popupsScrollableElement,
-        focusTrap: true
+        focusTrap: true,
+        zIndex: akEditorMenuZIndex
       }, jsx(EmojiPickerWithListeners, {
         emojiProvider: emojiProvider,
         onSelection: this.handleSelectedEmoji,

package/dist/esm/plugins/submit-editor/index.js

@@ -2,14 +2,14 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
 import { submit } from '@atlaskit/editor-common/keymaps';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { stateKey as mediaPluginKey } from '../../plugins/media/pm-plugins/plugin-key';
 import { analyticsEventKey } from '../analytics/consts';
-export function createPlugin(eventDispatch, onSave) {
+export function createPlugin(eventDispatch, api, onSave) {
   if (!onSave) {
     return;
   }
   return keymap(_defineProperty({}, "".concat(submit.common), function _(state, _dispatch, editorView) {
-    var mediaState = mediaPluginKey.getState(state);
+    var _api$media, _api$media$sharedStat;
+    var mediaState = api === null || api === void 0 ? void 0 : (_api$media = api.media) === null || _api$media === void 0 ? void 0 : (_api$media$sharedStat = _api$media.sharedState) === null || _api$media$sharedStat === void 0 ? void 0 : _api$media$sharedStat.currentState();
     if (mediaState && mediaState.waitForMediaUpload && !mediaState.allUploadsFinished) {
       return true;
     }
@@ -38,7 +38,8 @@ var analyticsPayload = function analyticsPayload(state) {
   };
 };
 var submitEditorPlugin = function submitEditorPlugin(_ref) {
-  var onSave = _ref.config;
+  var onSave = _ref.config,
+    api = _ref.api;
   return {
     name: 'submitEditor',
     pmPlugins: function pmPlugins() {
@@ -46,7 +47,7 @@ var submitEditorPlugin = function submitEditorPlugin(_ref) {
         name: 'submitEditor',
         plugin: function plugin(_ref2) {
           var dispatch = _ref2.dispatch;
-          return createPlugin(dispatch, onSave);
+          return createPlugin(dispatch, api, onSave);
         }
       }];
     }

package/dist/esm/ui/Appearance/Comment/Comment.js

@@ -10,7 +10,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
 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; } }
 /** @jsx jsx */
-import React from 'react';
+import React, { Fragment } from 'react';
 import { css, jsx } from '@emotion/react';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/custom-theme-button';
@@ -18,9 +18,6 @@ import { borderRadius } from '@atlaskit/theme/constants';
 import { N40 } from '@atlaskit/theme/colors';
 import Toolbar from '../../Toolbar';
 import PluginSlot from '../../PluginSlot';
-import WithPluginState from '../../WithPluginState';
-import { pluginKey as maxContentSizePluginKey } from '../../../plugins/max-content-size';
-import { stateKey as mediaPluginKey } from '../../../plugins/media/pm-plugins/plugin-key';
 import { ClickAreaBlock } from '../../Addon';
 import { tableCommentEditorStyles } from '@atlaskit/editor-plugin-table/ui/common-styles';
 import WithFlash from '../../WithFlash';
@@ -31,9 +28,11 @@ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import classnames from 'classnames';
 import { injectIntl } from 'react-intl-next';
 import messages from '../../../messages';
+import { usePresetContext } from '../../../presets/context';
 import { TableControlsPadding, MainToolbar, mainToolbarCustomComponentsSlotStyle } from './Toolbar';
 import { createEditorContentStyle } from '../../ContentStyles';
 import { ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 var CommentEditorMargin = 14;
 var commentEditorStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n\n  .less-margin .ProseMirror {\n    margin: ", " ", "\n      ", ";\n  }\n\n  min-width: 272px;\n  /* Border + Toolbar + Footer + (Paragraph + ((Paragraph + Margin) * (DefaultLines - 1)) */\n  /* calc(2px + 40px + 24px + ( 20px + (32px * 2))) */\n\n  height: auto;\n  background-color: ", ";\n  border: 1px solid ", ";\n  box-sizing: border-box;\n  border-radius: ", "px;\n\n  max-width: inherit;\n  word-wrap: break-word;\n"])), "var(--ds-space-150, 12px)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-background-input, white)", "var(--ds-border, ".concat(N40, ")"), borderRadius());
 var ContentArea = createEditorContentStyle(css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  flex-grow: 1;\n  overflow-x: ", ";\n  line-height: 24px;\n\n  /** Hack for Bitbucket to ensure entire editorView gets drop event; see ED-3294 **/\n  /** Hack for table controls. Otherwise margin collapse and controls are misplaced. **/\n  .ProseMirror {\n    margin: ", " ", "px\n      ", "px;\n  }\n\n  .gridParent {\n    margin-left: ", "px;\n    margin-right: ", "px;\n    width: calc(100% + ", "px);\n  }\n\n  padding: ", "px;\n\n  ", ";\n"])), getBooleanFF('platform.editor.table-sticky-scrollbar') ? 'clip' : 'hidden', "var(--ds-space-150, 12px)", CommentEditorMargin, CommentEditorMargin, CommentEditorMargin - GRID_GUTTER, CommentEditorMargin - GRID_GUTTER, CommentEditorMargin - GRID_GUTTER, TableControlsPadding, tableCommentEditorStyles));
@@ -188,16 +187,23 @@ var Editor = /*#__PURE__*/function (_React$Component) {
   _createClass(Editor, [{
     key: "render",
     value: function render() {
-      return jsx(WithPluginState, {
-        plugins: {
-          maxContentSize: maxContentSizePluginKey,
-          mediaState: mediaPluginKey
-        },
-        render: this.renderChrome
+      return jsx(RenderWithPluginState, {
+        renderChrome: this.renderChrome
       });
     }
   }]);
   return Editor;
 }(React.Component);
 _defineProperty(Editor, "displayName", 'CommentEditorAppearance');
+function RenderWithPluginState(_ref4) {
+  var renderChrome = _ref4.renderChrome;
+  var api = usePresetContext();
+  var _useSharedPluginState = useSharedPluginState(api, ['media', 'maxContentSize']),
+    mediaState = _useSharedPluginState.mediaState,
+    maxContentSizeState = _useSharedPluginState.maxContentSizeState;
+  return jsx(Fragment, null, renderChrome({
+    maxContentSize: maxContentSizeState,
+    mediaState: mediaState
+  }));
+}
 export var CommentEditorWithIntl = injectIntl(Editor);

package/dist/esm/version-wrapper.js

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