@atlaskit/editor-core 192.6.0 → 193.0.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-core
 
+## 193.0.0
+
+### Major Changes
+
+- [#78867](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/78867) [`283c8a390db7`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/283c8a390db7) - Move annotation plugin from default preset to universal preset
+
+### Patch Changes
+
+- [#75947](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/75947) [`43549c3789b1`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/43549c3789b1) - Migrate @atlaskit/editor-core to use declarative entry points
+
+## 192.7.0
+
+### Minor Changes
+
+- [#77607](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/77607) [`78ab76808037`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/78ab76808037) - Fixed bug where save button state was not updated correctly for when media upload is in progress or finish uploading
+
 ## 192.6.0
 
 ### Minor Changes

package/dist/cjs/create-editor/create-plugins-list.js

@@ -77,7 +77,6 @@ function getDefaultPresetOptionsFromEditorProps(props, createAnalyticsEvent) {
     textFormatting: _objectSpread(_objectSpread({}, props.textFormatting || {}), {}, {
       responsiveToolbarMenu: ((_props$textFormatting = props.textFormatting) === null || _props$textFormatting === void 0 ? void 0 : _props$textFormatting.responsiveToolbarMenu) != null ? props.textFormatting.responsiveToolbarMenu : props.allowUndoRedoButtons
     }),
-    annotationProviders: props.annotationProviders,
     submitEditor: props.onSave,
     quickInsert: {
       enableElementBrowser: props.elementBrowser && props.elementBrowser.showModal,

package/dist/cjs/preset-universal.js

@@ -4,10 +4,17 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "createUniversalPreset", {
+  enumerable: true,
+  get: function get() {
+    return _universal.default;
+  }
+});
 Object.defineProperty(exports, "useUniversalPreset", {
   enumerable: true,
   get: function get() {
     return _useUniversalPreset.default;
   }
 });
-var _useUniversalPreset = _interopRequireDefault(require("./presets/useUniversalPreset"));
+var _useUniversalPreset = _interopRequireDefault(require("./presets/useUniversalPreset"));
+var _universal = _interopRequireDefault(require("./presets/universal"));

package/dist/cjs/presets/default.js

@@ -9,7 +9,6 @@ exports.useDefaultPreset = useDefaultPreset;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _preset = require("@atlaskit/editor-common/preset");
 var _analytics = require("@atlaskit/editor-plugins/analytics");
-var _annotation = require("@atlaskit/editor-plugins/annotation");
 var _base = require("@atlaskit/editor-plugins/base");
 var _betterTypeHistory = require("@atlaskit/editor-plugins/better-type-history");
 var _blockType = require("@atlaskit/editor-plugins/block-type");
@@ -56,7 +55,7 @@ function createDefaultPreset(options) {
     contextIdentifierProvider: options.contextIdentifierProvider
   }]).add([_base.basePlugin, options.base]).add(_decorations.decorationsPlugin).add([_typeAhead.typeAheadPlugin, options.typeAhead || {
     createAnalyticsEvent: options.createAnalyticsEvent
-  }]).maybeAdd(_history.historyPlugin, Boolean(isMobile || options.allowUndoRedoButtons)).maybeAdd(_undoRedo.undoRedoPlugin, Boolean((_options$featureFlags = (_options$featureFlags2 = options.featureFlags) === null || _options$featureFlags2 === void 0 ? void 0 : _options$featureFlags2.undoRedoButtons) !== null && _options$featureFlags !== void 0 ? _options$featureFlags : options.allowUndoRedoButtons)).add([_blockType.blockTypePlugin, options.blockType]).add(_clearMarksOnEmptyDoc.clearMarksOnEmptyDocPlugin).maybeAdd([_annotation.annotationPlugin, options.annotationProviders], Boolean(options.annotationProviders)).maybeAdd([_selectionToolbar.selectionToolbarPlugin, {
+  }]).maybeAdd(_history.historyPlugin, Boolean(isMobile || options.allowUndoRedoButtons)).maybeAdd(_undoRedo.undoRedoPlugin, Boolean((_options$featureFlags = (_options$featureFlags2 = options.featureFlags) === null || _options$featureFlags2 === void 0 ? void 0 : _options$featureFlags2.undoRedoButtons) !== null && _options$featureFlags !== void 0 ? _options$featureFlags : options.allowUndoRedoButtons)).add([_blockType.blockTypePlugin, options.blockType]).add(_clearMarksOnEmptyDoc.clearMarksOnEmptyDocPlugin).maybeAdd([_selectionToolbar.selectionToolbarPlugin, {
     preferenceToolbarAboveSelection: false
   }], function () {
     if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.enable-selection-toolbar_ucdwd')) {

package/dist/cjs/presets/universal.js

@@ -104,7 +104,7 @@ function createUniversalPreset(appearance, props, featureFlags, prevAppearance,
     __livePage: props.__livePage
   }], Boolean(props.allowExpand)).maybeAdd(_guideline.guidelinePlugin, Boolean(!isMobile && !isComment && !isChromeless && (props.media || props.allowTables))).maybeAdd([_grid.gridPlugin, {
     shouldCalcBreakoutGridLines: isFullPage
-  }], Boolean(props.media)).maybeAdd([_media.mediaPlugin, _objectSpread(_objectSpread({}, props.media), {}, {
+  }], Boolean(props.media)).maybeAdd([_annotation.annotationPlugin, props.annotationProviders], Boolean(props.annotationProviders)).maybeAdd([_media.mediaPlugin, _objectSpread(_objectSpread({}, props.media), {}, {
     allowLazyLoading: !isMobile,
     allowBreakoutSnapPoints: isFullPage,
     allowAdvancedToolBarOptions: typeof ((_props$media = props.media) === null || _props$media === void 0 ? void 0 : _props$media.allowAdvancedToolBarOptions) !== 'undefined' ? (_props$media2 = props.media) === null || _props$media2 === void 0 ? void 0 : _props$media2.allowAdvancedToolBarOptions : isFullPage || isComment,

package/dist/cjs/ui/Addon/ClickAreaBlock/index.js

@@ -5,13 +5,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.ClickAreaBlock = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
 var _clickAreaHelper = require("../click-area-helper");
-var _templateObject;
 /** @jsx jsx */
-var clickWrapper = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  flex-grow: 1;\n  height: 100%;\n"])));
+
+var clickWrapper = (0, _react2.css)({
+  flexGrow: 1,
+  height: '100%'
+});
 var ClickAreaBlock = exports.ClickAreaBlock = function ClickAreaBlock(_ref) {
   var editorView = _ref.editorView,
     editorDisabled = _ref.editorDisabled,

package/dist/cjs/ui/Addon/ClickAreaInline/index.js

@@ -5,13 +5,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.ClickAreaInline = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
 var _commands = require("@atlaskit/editor-common/commands");
-var _templateObject;
 /** @jsx jsx */
-var clickArea = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  flex-grow: 1;\n"])));
+
+var clickArea = (0, _react2.css)({
+  flexGrow: 1
+});
 var ClickAreaInline = exports.ClickAreaInline = function ClickAreaInline(_ref) {
   var editorView = _ref.editorView,
     children = _ref.children;

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

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.CommentEditorWithIntl = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
@@ -13,7 +14,6 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 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 = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
 var _classnames = _interopRequireDefault(require("classnames"));
@@ -37,17 +37,49 @@ var _PluginSlot = _interopRequireDefault(require("../../PluginSlot"));
 var _Toolbar = _interopRequireDefault(require("../../Toolbar"));
 var _WithFlash = _interopRequireDefault(require("../../WithFlash"));
 var _Toolbar2 = require("./Toolbar");
-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; } }
+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; } } /* eslint-disable @atlaskit/design-system/ensure-design-token-usage/preview */ /** @jsx jsx */
 var CommentEditorMargin = 14;
-var commentEditorStyle = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\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(_colors.N40, ")"), (0, _constants.borderRadius)());
-var ContentArea = (0, _ContentStyles.createEditorContentStyle)((0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\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: ", ";\n  }\n\n  .gridParent {\n    margin-left: ", "px;\n    margin-right: ", "px;\n    width: calc(100% + ", "px);\n  }\n\n  padding: ", ";\n\n  ", ";\n"])), (0, _platformFeatureFlags.getBooleanFF)('platform.editor.table-sticky-scrollbar') ? 'clip' : 'hidden', "var(--ds-space-150, 12px)", CommentEditorMargin - _styles.GRID_GUTTER, CommentEditorMargin - _styles.GRID_GUTTER, CommentEditorMargin - _styles.GRID_GUTTER, "var(--ds-space-250, 20px)", _commonStyles.tableCommentEditorStyles));
+var commentEditorStyle = (0, _react2.css)({
+  display: 'flex',
+  flexDirection: 'column',
+  '.less-margin .ProseMirror': {
+    margin: "var(--ds-space-150, 12px)".concat(" ", "var(--ds-space-100, 8px)", " ", "var(--ds-space-100, 8px)")
+  },
+  minWidth: '272px',
+  height: 'auto',
+  backgroundColor: "var(--ds-background-input, white)",
+  border: "1px solid ".concat("var(--ds-border, ".concat(_colors.N40, ")")),
+  boxSizing: 'border-box',
+  borderRadius: "".concat((0, _constants.borderRadius)(), "px"),
+  maxWidth: 'inherit',
+  wordWrap: 'break-word'
+});
+var ContentArea = (0, _ContentStyles.createEditorContentStyle)((0, _react2.css)({
+  flexGrow: 1,
+  overflowX: (0, _platformFeatureFlags.getBooleanFF)('platform.editor.table-sticky-scrollbar') ? 'clip' : 'hidden',
+  lineHeight: '24px',
+  '.ProseMirror': {
+    margin: "var(--ds-space-150, 12px)"
+  },
+  '.gridParent': {
+    marginLeft: "".concat(CommentEditorMargin - _styles.GRID_GUTTER, "px"),
+    marginRight: "".concat(CommentEditorMargin - _styles.GRID_GUTTER, "px"),
+    width: "calc(100% + ".concat(CommentEditorMargin - _styles.GRID_GUTTER, "px)")
+  },
+  padding: "var(--ds-space-250, 20px)"
+}, _commonStyles.tableCommentEditorStyles));
 ContentArea.displayName = 'ContentArea';
-var secondaryToolbarStyle = (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  box-sizing: border-box;\n  justify-content: flex-end;\n  align-items: center;\n  display: flex;\n  padding: ", " ", ";\n"])), "var(--ds-space-150, 12px)", "var(--ds-space-025, 2px)");
+var secondaryToolbarStyle = (0, _react2.css)({
+  boxSizing: 'border-box',
+  justifyContent: 'flex-end',
+  alignItems: 'center',
+  display: 'flex',
+  padding: "var(--ds-space-150, 12px)".concat(" ", "var(--ds-space-025, 2px)")
+});
+var appearance = 'comment';
 var Editor = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(Editor, _React$Component);
   var _super = _createSuper(Editor);
@@ -114,7 +146,9 @@ var Editor = /*#__PURE__*/function (_React$Component) {
       return (0, _react2.jsx)(_WithFlash.default, {
         animate: maxContentSizeReached
       }, (0, _react2.jsx)("div", {
-        css: [commentEditorStyle, (0, _react2.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n              min-height: ", "px;\n            "])), minHeight)],
+        css: [commentEditorStyle, (0, _react2.css)({
+          minHeight: "".concat(minHeight, "px")
+        })],
         className: "akEditor",
         ref: _this.wrapperElementRef
       }, (0, _react2.jsx)(_Toolbar2.MainToolbar, {
@@ -153,7 +187,9 @@ var Editor = /*#__PURE__*/function (_React$Component) {
           ref: function ref(_ref3) {
             return _this.containerElement = _ref3;
           },
-          css: maxHeight ? (0, _react2.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n                            max-height: ", "px;\n                          "])), maxHeight) : null,
+          css: maxHeight ? (0, _react2.css)({
+            maxHeight: "".concat(maxHeight, "px")
+          }) : null,
           className: (0, _classnames.default)('ak-editor-content-area', {
             'less-margin': width < _editorSharedStyles.akEditorMobileBreakoutPoint
           }),
@@ -219,4 +255,165 @@ function RenderWithPluginState(_ref4) {
     mediaState: mediaState !== null && mediaState !== void 0 ? mediaState : undefined
   }));
 }
-var CommentEditorWithIntl = exports.CommentEditorWithIntl = (0, _reactIntlNext.injectIntl)(Editor);
+var EditorNext = function EditorNext(props) {
+  var api = (0, _context.usePresetContext)();
+  var _useSharedPluginState2 = (0, _hooks.useSharedPluginState)(api, ['media', 'maxContentSize']),
+    mediaState = _useSharedPluginState2.mediaState,
+    maxContentSizeState = _useSharedPluginState2.maxContentSizeState;
+  var editorDOMElement = props.editorDOMElement,
+    editorView = props.editorView,
+    editorActions = props.editorActions,
+    eventDispatcher = props.eventDispatcher,
+    providerFactory = props.providerFactory,
+    contentComponents = props.contentComponents,
+    customContentComponents = props.customContentComponents,
+    customPrimaryToolbarComponents = props.customPrimaryToolbarComponents,
+    primaryToolbarComponents = props.primaryToolbarComponents,
+    customSecondaryToolbarComponents = props.customSecondaryToolbarComponents,
+    popupsMountPoint = props.popupsMountPoint,
+    popupsBoundariesElement = props.popupsBoundariesElement,
+    popupsScrollableElement = props.popupsScrollableElement,
+    maxHeight = props.maxHeight,
+    _props$minHeight = props.minHeight,
+    minHeight = _props$minHeight === void 0 ? 150 : _props$minHeight,
+    onSave = props.onSave,
+    onCancel = props.onCancel,
+    disabled = props.disabled,
+    dispatchAnalyticsEvent = props.dispatchAnalyticsEvent,
+    intl = props.intl,
+    useStickyToolbar = props.useStickyToolbar,
+    pluginHooks = props.pluginHooks,
+    featureFlags = props.featureFlags,
+    innerRef = props.innerRef;
+  var maxContentSizeReached = Boolean(maxContentSizeState === null || maxContentSizeState === void 0 ? void 0 : maxContentSizeState.maxContentSizeReached);
+  var showSecondaryToolbar = !!onSave || !!onCancel || !!customSecondaryToolbarComponents;
+  var containerElement = null;
+
+  // Wrapper container for toolbar and content area
+  var wrapperElementRef = (0, _react.useMemo)(function () {
+    return innerRef || /*#__PURE__*/_react.default.createRef();
+  }, [innerRef]);
+  var _useState = (0, _react.useState)(disabled),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    saveButtonDisabled = _useState2[0],
+    setSaveButtonDisabled = _useState2[1];
+  (0, _react.useEffect)(function () {
+    if (mediaState) {
+      mediaState.subscribeToUploadInProgressState(setSaveButtonDisabled);
+    }
+    return function () {
+      return mediaState === null || mediaState === void 0 ? void 0 : mediaState.unsubscribeFromUploadInProgressState(setSaveButtonDisabled);
+    };
+  }, [mediaState]);
+  var handleSave = (0, _react.useCallback)(function () {
+    if (editorView && onSave) {
+      onSave(editorView);
+    }
+  }, [editorView, onSave]);
+  var handleCancel = (0, _react.useCallback)(function () {
+    if (editorView && onCancel) {
+      onCancel(editorView);
+    }
+  }, [editorView, onCancel]);
+  var isShortcutToFocusToolbar = (0, _react.useCallback)(function (event) {
+    //Alt + F9 to reach first element in this main toolbar
+    return event.altKey && (event.key === 'F9' || event.keyCode === 120);
+  }, []);
+  var isTwoLineToolbarEnabled = !!customPrimaryToolbarComponents && !!(featureFlags !== null && featureFlags !== void 0 && featureFlags.twoLineEditorToolbar);
+  var handleEscape = (0, _react.useCallback)(function (event) {
+    if (!(editorView !== null && editorView !== void 0 && editorView.hasFocus())) {
+      editorView === null || editorView === void 0 || editorView.focus();
+    }
+    event.preventDefault();
+    event.stopPropagation();
+  }, [editorView]);
+  return (0, _react2.jsx)(_WithFlash.default, {
+    animate: maxContentSizeReached
+  }, (0, _react2.jsx)("div", {
+    css: [commentEditorStyle, (0, _react2.css)({
+      minHeight: "".concat(minHeight, "px")
+    })],
+    className: "akEditor",
+    ref: wrapperElementRef
+  }, (0, _react2.jsx)(_Toolbar2.MainToolbar, {
+    useStickyToolbar: useStickyToolbar,
+    twoLineEditorToolbar: isTwoLineToolbarEnabled
+  }, (0, _react2.jsx)(_uiMenu.ToolbarArrowKeyNavigationProvider, {
+    editorView: editorView,
+    childComponentSelector: "[data-testid='ak-editor-main-toolbar']",
+    isShortcutToFocusToolbar: isShortcutToFocusToolbar,
+    handleEscape: handleEscape,
+    editorAppearance: appearance,
+    useStickyToolbar: useStickyToolbar,
+    intl: intl
+  }, (0, _react2.jsx)(_Toolbar.default, {
+    editorView: editorView,
+    editorActions: editorActions,
+    eventDispatcher: eventDispatcher,
+    providerFactory: providerFactory,
+    appearance: appearance,
+    items: primaryToolbarComponents,
+    popupsMountPoint: popupsMountPoint,
+    popupsBoundariesElement: popupsBoundariesElement,
+    popupsScrollableElement: popupsScrollableElement,
+    disabled: !!disabled,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    containerElement: containerElement,
+    twoLineEditorToolbar: isTwoLineToolbarEnabled
+  }), (0, _react2.jsx)("div", {
+    css: (0, _Toolbar2.mainToolbarCustomComponentsSlotStyle)(isTwoLineToolbarEnabled)
+  }, customPrimaryToolbarComponents))), (0, _react2.jsx)(_Addon.ClickAreaBlock, {
+    editorView: editorView,
+    editorDisabled: disabled
+  }, (0, _react2.jsx)(_ui.WidthConsumer, null, function (_ref5) {
+    var width = _ref5.width;
+    return (0, _react2.jsx)(ContentArea, {
+      ref: function ref(_ref6) {
+        return containerElement = _ref6;
+      },
+      css: maxHeight ? (0, _react2.css)({
+        maxHeight: "".concat(maxHeight, "px")
+      }) : null,
+      className: (0, _classnames.default)('ak-editor-content-area', {
+        'less-margin': width < _editorSharedStyles.akEditorMobileBreakoutPoint
+      }),
+      featureFlags: featureFlags
+    }, customContentComponents && 'before' in customContentComponents ? customContentComponents.before : customContentComponents, (0, _react2.jsx)(_PluginSlot.default, {
+      editorView: editorView,
+      editorActions: editorActions,
+      eventDispatcher: eventDispatcher,
+      dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+      providerFactory: providerFactory,
+      appearance: appearance,
+      items: contentComponents,
+      popupsMountPoint: popupsMountPoint,
+      popupsBoundariesElement: popupsBoundariesElement,
+      popupsScrollableElement: popupsScrollableElement,
+      containerElement: containerElement,
+      disabled: !!disabled,
+      wrapperElement: wrapperElementRef.current,
+      pluginHooks: pluginHooks
+    }), editorDOMElement, customContentComponents && 'after' in customContentComponents ? customContentComponents.after : null);
+  }))), showSecondaryToolbar && (0, _react2.jsx)("div", {
+    css: secondaryToolbarStyle,
+    "data-testid": "ak-editor-secondary-toolbar"
+  }, (0, _react2.jsx)(_buttonGroup.default, null, !!onSave && (0, _react2.jsx)(_customThemeButton.default, {
+    appearance: "primary",
+    onClick: handleSave,
+    testId: "comment-save-button",
+    isDisabled: disabled || saveButtonDisabled
+  }, intl.formatMessage(_messages.default.saveButton)), !!onCancel && (0, _react2.jsx)(_customThemeButton.default, {
+    appearance: "subtle",
+    onClick: handleCancel,
+    isDisabled: disabled
+  }, intl.formatMessage(_messages.default.cancelButton))), (0, _react2.jsx)("span", {
+    style: {
+      flexGrow: 1
+    }
+  }), customSecondaryToolbarComponents));
+};
+EditorNext.displayName = 'CommentEditorAppearance';
+var CommentEditorNextWithIntl = (0, _reactIntlNext.injectIntl)(EditorNext);
+var CommentEditorOldWithIntl = (0, _reactIntlNext.injectIntl)(Editor);
+var ExportComp = (0, _platformFeatureFlags.getBooleanFF)('platform.editor.media.alluploadsfinished-dispatch-update_ivtow') ? CommentEditorNextWithIntl : CommentEditorOldWithIntl;
+var CommentEditorWithIntl = exports.CommentEditorWithIntl = ExportComp;

package/dist/cjs/version-wrapper.js

@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.version = exports.name = void 0;
 var name = exports.name = "@atlaskit/editor-core";
-var version = exports.version = "192.6.0";
+var version = exports.version = "193.0.0";

package/dist/es2019/create-editor/create-plugins-list.js

@@ -65,7 +65,6 @@ export function getDefaultPresetOptionsFromEditorProps(props, createAnalyticsEve
       ...(props.textFormatting || {}),
       responsiveToolbarMenu: ((_props$textFormatting = props.textFormatting) === null || _props$textFormatting === void 0 ? void 0 : _props$textFormatting.responsiveToolbarMenu) != null ? props.textFormatting.responsiveToolbarMenu : props.allowUndoRedoButtons
     },
-    annotationProviders: props.annotationProviders,
     submitEditor: props.onSave,
     quickInsert: {
       enableElementBrowser: props.elementBrowser && props.elementBrowser.showModal,

package/dist/es2019/preset-universal.js

@@ -1 +1,2 @@
-export { default as useUniversalPreset } from './presets/useUniversalPreset';
+export { default as useUniversalPreset } from './presets/useUniversalPreset';
+export { default as createUniversalPreset } from './presets/universal';

package/dist/es2019/presets/default.js

@@ -2,7 +2,6 @@
 
 import { EditorPresetBuilder } from '@atlaskit/editor-common/preset';
 import { analyticsPlugin } from '@atlaskit/editor-plugins/analytics';
-import { annotationPlugin } from '@atlaskit/editor-plugins/annotation';
 import { basePlugin } from '@atlaskit/editor-plugins/base';
 import { betterTypeHistoryPlugin } from '@atlaskit/editor-plugins/better-type-history';
 import { blockTypePlugin } from '@atlaskit/editor-plugins/block-type';
@@ -48,7 +47,7 @@ export function createDefaultPreset(options) {
     contextIdentifierProvider: options.contextIdentifierProvider
   }]).add([basePlugin, options.base]).add(decorationsPlugin).add([typeAheadPlugin, options.typeAhead || {
     createAnalyticsEvent: options.createAnalyticsEvent
-  }]).maybeAdd(historyPlugin, Boolean(isMobile || options.allowUndoRedoButtons)).maybeAdd(undoRedoPlugin, Boolean((_options$featureFlags = (_options$featureFlags2 = options.featureFlags) === null || _options$featureFlags2 === void 0 ? void 0 : _options$featureFlags2.undoRedoButtons) !== null && _options$featureFlags !== void 0 ? _options$featureFlags : options.allowUndoRedoButtons)).add([blockTypePlugin, options.blockType]).add(clearMarksOnEmptyDocPlugin).maybeAdd([annotationPlugin, options.annotationProviders], Boolean(options.annotationProviders)).maybeAdd([selectionToolbarPlugin, {
+  }]).maybeAdd(historyPlugin, Boolean(isMobile || options.allowUndoRedoButtons)).maybeAdd(undoRedoPlugin, Boolean((_options$featureFlags = (_options$featureFlags2 = options.featureFlags) === null || _options$featureFlags2 === void 0 ? void 0 : _options$featureFlags2.undoRedoButtons) !== null && _options$featureFlags !== void 0 ? _options$featureFlags : options.allowUndoRedoButtons)).add([blockTypePlugin, options.blockType]).add(clearMarksOnEmptyDocPlugin).maybeAdd([selectionToolbarPlugin, {
     preferenceToolbarAboveSelection: false
   }], () => {
     if (getBooleanFF('platform.editor.enable-selection-toolbar_ucdwd')) {

package/dist/es2019/presets/universal.js

@@ -92,7 +92,7 @@ export default function createUniversalPreset(appearance, props, featureFlags, p
     __livePage: props.__livePage
   }], Boolean(props.allowExpand)).maybeAdd(guidelinePlugin, Boolean(!isMobile && !isComment && !isChromeless && (props.media || props.allowTables))).maybeAdd([gridPlugin, {
     shouldCalcBreakoutGridLines: isFullPage
-  }], Boolean(props.media)).maybeAdd([mediaPlugin, {
+  }], Boolean(props.media)).maybeAdd([annotationPlugin, props.annotationProviders], Boolean(props.annotationProviders)).maybeAdd([mediaPlugin, {
     ...props.media,
     allowLazyLoading: !isMobile,
     allowBreakoutSnapPoints: isFullPage,

package/dist/es2019/ui/Addon/ClickAreaBlock/index.js

@@ -2,10 +2,10 @@
 import React from 'react';
 import { css, jsx } from '@emotion/react';
 import { clickAreaClickHandler } from '../click-area-helper';
-const clickWrapper = css`
-  flex-grow: 1;
-  height: 100%;
-`;
+const clickWrapper = css({
+  flexGrow: 1,
+  height: '100%'
+});
 export const ClickAreaBlock = ({
   editorView,
   editorDisabled,

package/dist/es2019/ui/Addon/ClickAreaInline/index.js

@@ -2,9 +2,9 @@
 import React from 'react';
 import { css, jsx } from '@emotion/react';
 import { createParagraphAtEnd } from '@atlaskit/editor-common/commands';
-const clickArea = css`
-  flex-grow: 1;
-`;
+const clickArea = css({
+  flexGrow: 1
+});
 export const ClickAreaInline = ({
   editorView,
   children