@atlaskit/editor-core 193.5.3 → 193.5.6

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/editor-core
 
+## 193.5.6
+
+### Patch Changes
+
+- [#81777](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/81777) [`c6d7a5378751`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c6d7a5378751) - Bump adf-schema to 35.7.0
+- [#83037](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/83037) [`659c2a11c370`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/659c2a11c370) - [ux] Fix bodied macro copy/delete behavior
+
+## 193.5.5
+
+### Patch Changes
+
+- [#83044](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/83044) [`cdab77009f9e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/cdab77009f9e) - Fix leftover react 18 type issues in editor-core, editor-plugin-extension and date
+
 ## 193.5.3
 
 ### Patch Changes

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

@@ -42,7 +42,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 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() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /** @jsx jsx */
 var CommentEditorMargin = 14;
-var commentEditorStyle = (0, _react2.css)({
+var commentEditorStyles = (0, _react2.css)({
   display: 'flex',
   flexDirection: 'column',
   '.less-margin .ProseMirror': {
@@ -72,7 +72,7 @@ var ContentArea = (0, _ContentStyles.createEditorContentStyle)((0, _react2.css)(
   padding: "var(--ds-space-250, 20px)"
 }, _commonStyles.tableCommentEditorStyles));
 ContentArea.displayName = 'ContentArea';
-var secondaryToolbarStyle = (0, _react2.css)({
+var secondaryToolbarStyles = (0, _react2.css)({
   boxSizing: 'border-box',
   justifyContent: 'flex-end',
   alignItems: 'center',
@@ -146,7 +146,7 @@ var Editor = /*#__PURE__*/function (_React$Component) {
       return (0, _react2.jsx)(_WithFlash.default, {
         animate: maxContentSizeReached
       }, (0, _react2.jsx)("div", {
-        css: [commentEditorStyle, (0, _react2.css)({
+        css: [commentEditorStyles, (0, _react2.css)({
           minHeight: "".concat(minHeight, "px")
         })],
         className: "akEditor",
@@ -211,7 +211,7 @@ var Editor = /*#__PURE__*/function (_React$Component) {
           pluginHooks: pluginHooks
         }), editorDOMElement, customContentComponents && 'after' in customContentComponents ? customContentComponents.after : null);
       }))), showSecondaryToolbar && (0, _react2.jsx)("div", {
-        css: secondaryToolbarStyle,
+        css: secondaryToolbarStyles,
         "data-testid": "ak-editor-secondary-toolbar"
       }, (0, _react2.jsx)(_buttonGroup.default, null, !!onSave && (0, _react2.jsx)(_customThemeButton.default, {
         appearance: "primary",
@@ -330,7 +330,7 @@ var EditorNext = function EditorNext(props) {
   return (0, _react2.jsx)(_WithFlash.default, {
     animate: maxContentSizeReached
   }, (0, _react2.jsx)("div", {
-    css: [commentEditorStyle, (0, _react2.css)({
+    css: [commentEditorStyles, (0, _react2.css)({
       minHeight: "".concat(minHeight, "px")
     })],
     className: "akEditor",
@@ -395,7 +395,7 @@ var EditorNext = function EditorNext(props) {
       pluginHooks: pluginHooks
     }), editorDOMElement, customContentComponents && 'after' in customContentComponents ? customContentComponents.after : null);
   }))), showSecondaryToolbar && (0, _react2.jsx)("div", {
-    css: secondaryToolbarStyle,
+    css: secondaryToolbarStyles,
     "data-testid": "ak-editor-secondary-toolbar"
   }, (0, _react2.jsx)(_buttonGroup.default, null, !!onSave && (0, _react2.jsx)(_customThemeButton.default, {
     appearance: "primary",

package/dist/cjs/ui/ContentStyles/extension.js

@@ -9,6 +9,8 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 var _react = require("@emotion/react");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _colors = require("@atlaskit/theme/colors");
-var _templateObject;
+var _templateObject, _templateObject2;
+var extensionLabelStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  &.danger > span > div > .extension-label {\n    background-color: ", ";\n    color: ", ";\n    opacity: 1;\n  }\n\n  &:not(.danger).", "\n    > span\n    > div\n    > .extension-label {\n    background-color: ", ";\n    color: ", ";\n    opacity: 1;\n  }\n"])), "var(--ds-background-accent-red-subtler, ".concat(_colors.R200, ")"), "var(--ds-text-danger, ".concat(_colors.R400, ")"), _editorSharedStyles.akEditorSelectedNodeClassName, "var(--ds-background-selected, ".concat(_colors.B50, ")"), "var(--ds-text-selected, ".concat(_colors.B400, ")"));
+
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/design-system/no-exported-css -- Needs manual remediation
-var extensionStyles = exports.extensionStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .multiBodiedExtensionView-content-wrap {\n    &.danger > span > .multiBodiedExtension--container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &.danger > span > div > .extension-label {\n      background-color: ", ";\n      color: ", ";\n    }\n\n    &:not(.danger).", " {\n      & > span > .multiBodiedExtension--container {\n        ", "\n      }\n    }\n    .multiBodiedExtension--container {\n      width: 100%;\n      max-width: 100%; // ensure width can't go over 100%;\n    }\n  }\n\n  .inlineExtensionView-content-wrap {\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    &.danger > span > div > .extension-label {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n\n  .extensionView-content-wrap,\n  .multiBodiedExtensionView-content-wrap,\n  .bodiedExtensionView-content-wrap {\n    margin: ", " 0;\n\n    &:first-of-type {\n      margin-top: 0;\n    }\n\n    &:last-of-type {\n      margin-bottom: 0;\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &.danger > span > div > .extension-label {\n      background-color: ", ";\n      color: ", ";\n    }\n\n    &.inline {\n      word-wrap: break-all;\n    }\n  }\n\n  .extensionView-content-wrap .extension-container {\n    overflow: hidden;\n  }\n\n  .bodiedExtensionView-content-wrap\n    .extensionView-content-wrap\n    .extension-container {\n    width: 100%;\n    max-width: 100%; // ensure width can't go over 100%;\n  }\n\n  [data-mark-type='fragment'] {\n    & > .extensionView-content-wrap,\n    & > .bodiedExtensionView-content-wrap {\n      margin: ", " 0;\n    }\n\n    & > [data-mark-type='dataConsumer'] {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin: ", " 0;\n      }\n    }\n\n    &:first-child {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-top: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-top: 0;\n        }\n      }\n    }\n\n    &:nth-last-of-type(-n + 2):not(:first-of-type) {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-bottom: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-bottom: 0;\n        }\n      }\n    }\n  }\n"])), _editorSharedStyles.akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(_editorSharedStyles.akEditorDeleteBackground, ")"), "var(--ds-background-accent-red-subtler, ".concat(_colors.R200, ")"), "var(--ds-text-danger, ".concat(_colors.R400, ")"), _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow, _editorSharedStyles.SelectionStyle.Blanket]), _editorSharedStyles.akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(_editorSharedStyles.akEditorDeleteBackground, ")"), _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), "var(--ds-background-accent-red-subtler, ".concat(_colors.R200, ")"), "var(--ds-text-danger, ".concat(_colors.R400, ")"), _editorSharedStyles.blockNodesVerticalMargin, _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _editorSharedStyles.akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(_editorSharedStyles.akEditorDeleteBackground, ")"), "var(--ds-background-accent-red-subtler, ".concat(_colors.R200, ")"), "var(--ds-text-danger, ".concat(_colors.R400, ")"), _editorSharedStyles.blockNodesVerticalMargin, _editorSharedStyles.blockNodesVerticalMargin);
+var extensionStyles = exports.extensionStyles = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  .multiBodiedExtensionView-content-wrap {\n    &.danger > span > .multiBodiedExtension--container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    ", "\n\n    &:not(.danger).", " {\n      & > span > .multiBodiedExtension--container {\n        ", "\n      }\n    }\n    .multiBodiedExtension--container {\n      width: 100%;\n      max-width: 100%; // ensure width can't go over 100%;\n    }\n  }\n\n  .inlineExtensionView-content-wrap {\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    ", "\n  }\n\n  .extensionView-content-wrap,\n  .multiBodiedExtensionView-content-wrap,\n  .bodiedExtensionView-content-wrap {\n    margin: ", " 0;\n\n    &:first-of-type {\n      margin-top: 0;\n    }\n\n    &:last-of-type {\n      margin-bottom: 0;\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    ", "\n\n    &.inline {\n      word-wrap: break-all;\n    }\n  }\n\n  .extensionView-content-wrap .extension-container {\n    overflow: hidden;\n  }\n\n  .bodiedExtensionView-content-wrap\n    .extensionView-content-wrap\n    .extension-container {\n    width: 100%;\n    max-width: 100%; // ensure width can't go over 100%;\n  }\n\n  [data-mark-type='fragment'] {\n    & > .extensionView-content-wrap,\n    & > .bodiedExtensionView-content-wrap {\n      margin: ", " 0;\n    }\n\n    & > [data-mark-type='dataConsumer'] {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin: ", " 0;\n      }\n    }\n\n    &:first-child {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-top: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-top: 0;\n        }\n      }\n    }\n\n    &:nth-last-of-type(-n + 2):not(:first-of-type) {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-bottom: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-bottom: 0;\n        }\n      }\n    }\n  }\n"])), _editorSharedStyles.akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(_editorSharedStyles.akEditorDeleteBackground, ")"), extensionLabelStyles, _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow, _editorSharedStyles.SelectionStyle.Blanket]), _editorSharedStyles.akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(_editorSharedStyles.akEditorDeleteBackground, ")"), _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), extensionLabelStyles, _editorSharedStyles.blockNodesVerticalMargin, _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _editorSharedStyles.akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(_editorSharedStyles.akEditorDeleteBackground, ")"), extensionLabelStyles, _editorSharedStyles.blockNodesVerticalMargin, _editorSharedStyles.blockNodesVerticalMargin);

package/dist/cjs/ui/WithHelpTrigger/index.js

@@ -31,7 +31,8 @@ var WithHelpTrigger = exports.default = /*#__PURE__*/function (_React$Component)
     }
     _this = _super.call.apply(_super, [this].concat(args));
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "openHelp", function () {
-      var editorActions = _this.context.editorActions;
+      var _ref = _this.context,
+        editorActions = _ref.editorActions;
       var dispatch = (0, _eventDispatcher.createDispatch)(editorActions.eventDispatcher);
       dispatch(_utils.analyticsEventKey, {
         payload: {

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 = "193.5.3";
+var version = exports.version = "193.5.6";

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

@@ -24,7 +24,7 @@ import Toolbar from '../../Toolbar';
 import WithFlash from '../../WithFlash';
 import { MainToolbar, mainToolbarCustomComponentsSlotStyle } from './Toolbar';
 const CommentEditorMargin = 14;
-const commentEditorStyle = css({
+const commentEditorStyles = css({
   display: 'flex',
   flexDirection: 'column',
   '.less-margin .ProseMirror': {
@@ -54,7 +54,7 @@ const ContentArea = createEditorContentStyle(css({
   padding: "var(--ds-space-250, 20px)"
 }, tableCommentEditorStyles));
 ContentArea.displayName = 'ContentArea';
-const secondaryToolbarStyle = css({
+const secondaryToolbarStyles = css({
   boxSizing: 'border-box',
   justifyContent: 'flex-end',
   alignItems: 'center',
@@ -125,7 +125,7 @@ class Editor extends React.Component {
       return jsx(WithFlash, {
         animate: maxContentSizeReached
       }, jsx("div", {
-        css: [commentEditorStyle, css({
+        css: [commentEditorStyles, css({
           minHeight: `${minHeight}px`
         })],
         className: "akEditor",
@@ -189,7 +189,7 @@ class Editor extends React.Component {
           pluginHooks: pluginHooks
         }), editorDOMElement, customContentComponents && 'after' in customContentComponents ? customContentComponents.after : null);
       }))), showSecondaryToolbar && jsx("div", {
-        css: secondaryToolbarStyle,
+        css: secondaryToolbarStyles,
         "data-testid": "ak-editor-secondary-toolbar"
       }, jsx(ButtonGroup, null, !!onSave && jsx(Button, {
         appearance: "primary",
@@ -300,7 +300,7 @@ const EditorNext = props => {
   return jsx(WithFlash, {
     animate: maxContentSizeReached
   }, jsx("div", {
-    css: [commentEditorStyle, css({
+    css: [commentEditorStyles, css({
       minHeight: `${minHeight}px`
     })],
     className: "akEditor",
@@ -364,7 +364,7 @@ const EditorNext = props => {
       pluginHooks: pluginHooks
     }), editorDOMElement, customContentComponents && 'after' in customContentComponents ? customContentComponents.after : null);
   }))), showSecondaryToolbar && jsx("div", {
-    css: secondaryToolbarStyle,
+    css: secondaryToolbarStyles,
     "data-testid": "ak-editor-secondary-toolbar"
   }, jsx(ButtonGroup, null, !!onSave && jsx(Button, {
     appearance: "primary",

package/dist/es2019/ui/ContentStyles/extension.js

@@ -1,6 +1,23 @@
 import { css } from '@emotion/react';
 import { akEditorDeleteBackground, akEditorDeleteBorder, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
-import { R200, R400 } from '@atlaskit/theme/colors';
+import { B400, B50, R200, R400 } from '@atlaskit/theme/colors';
+const extensionLabelStyles = css`
+  &.danger > span > div > .extension-label {
+    background-color: ${`var(--ds-background-accent-red-subtler, ${R200})`};
+    color: ${`var(--ds-text-danger, ${R400})`};
+    opacity: 1;
+  }
+
+  &:not(.danger).${akEditorSelectedNodeClassName}
+    > span
+    > div
+    > .extension-label {
+    background-color: ${`var(--ds-background-selected, ${B50})`};
+    color: ${`var(--ds-text-selected, ${B400})`};
+    opacity: 1;
+  }
+`;
+
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/design-system/no-exported-css -- Needs manual remediation
 export const extensionStyles = css`
   .multiBodiedExtensionView-content-wrap {
@@ -10,10 +27,7 @@ export const extensionStyles = css`
       background-color: ${`var(--ds-background-danger, ${akEditorDeleteBackground})`};
     }
 
-    &.danger > span > div > .extension-label {
-      background-color: ${`var(--ds-background-accent-red-subtler, ${R200})`};
-      color: ${`var(--ds-text-danger, ${R400})`};
-    }
+    ${extensionLabelStyles}
 
     &:not(.danger).${akEditorSelectedNodeClassName} {
       & > span > .multiBodiedExtension--container {
@@ -39,10 +53,7 @@ export const extensionStyles = css`
       }
     }
 
-    &.danger > span > div > .extension-label {
-      background-color: ${`var(--ds-background-accent-red-subtler, ${R200})`};
-      color: ${`var(--ds-text-danger, ${R400})`};
-    }
+    ${extensionLabelStyles}
   }
 
   .extensionView-content-wrap,
@@ -70,10 +81,7 @@ export const extensionStyles = css`
       background-color: ${`var(--ds-background-danger, ${akEditorDeleteBackground})`};
     }
 
-    &.danger > span > div > .extension-label {
-      background-color: ${`var(--ds-background-accent-red-subtler, ${R200})`};
-      color: ${`var(--ds-text-danger, ${R400})`};
-    }
+    ${extensionLabelStyles}
 
     &.inline {
       word-wrap: break-all;

package/dist/es2019/version-wrapper.js

@@ -1,2 +1,2 @@
 export const name = "@atlaskit/editor-core";
-export const version = "193.5.3";
+export const version = "193.5.6";

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

@@ -33,7 +33,7 @@ import Toolbar from '../../Toolbar';
 import WithFlash from '../../WithFlash';
 import { MainToolbar, mainToolbarCustomComponentsSlotStyle } from './Toolbar';
 var CommentEditorMargin = 14;
-var commentEditorStyle = css({
+var commentEditorStyles = css({
   display: 'flex',
   flexDirection: 'column',
   '.less-margin .ProseMirror': {
@@ -63,7 +63,7 @@ var ContentArea = createEditorContentStyle(css({
   padding: "var(--ds-space-250, 20px)"
 }, tableCommentEditorStyles));
 ContentArea.displayName = 'ContentArea';
-var secondaryToolbarStyle = css({
+var secondaryToolbarStyles = css({
   boxSizing: 'border-box',
   justifyContent: 'flex-end',
   alignItems: 'center',
@@ -137,7 +137,7 @@ var Editor = /*#__PURE__*/function (_React$Component) {
       return jsx(WithFlash, {
         animate: maxContentSizeReached
       }, jsx("div", {
-        css: [commentEditorStyle, css({
+        css: [commentEditorStyles, css({
           minHeight: "".concat(minHeight, "px")
         })],
         className: "akEditor",
@@ -202,7 +202,7 @@ var Editor = /*#__PURE__*/function (_React$Component) {
           pluginHooks: pluginHooks
         }), editorDOMElement, customContentComponents && 'after' in customContentComponents ? customContentComponents.after : null);
       }))), showSecondaryToolbar && jsx("div", {
-        css: secondaryToolbarStyle,
+        css: secondaryToolbarStyles,
         "data-testid": "ak-editor-secondary-toolbar"
       }, jsx(ButtonGroup, null, !!onSave && jsx(Button, {
         appearance: "primary",
@@ -321,7 +321,7 @@ var EditorNext = function EditorNext(props) {
   return jsx(WithFlash, {
     animate: maxContentSizeReached
   }, jsx("div", {
-    css: [commentEditorStyle, css({
+    css: [commentEditorStyles, css({
       minHeight: "".concat(minHeight, "px")
     })],
     className: "akEditor",
@@ -386,7 +386,7 @@ var EditorNext = function EditorNext(props) {
       pluginHooks: pluginHooks
     }), editorDOMElement, customContentComponents && 'after' in customContentComponents ? customContentComponents.after : null);
   }))), showSecondaryToolbar && jsx("div", {
-    css: secondaryToolbarStyle,
+    css: secondaryToolbarStyles,
     "data-testid": "ak-editor-secondary-toolbar"
   }, jsx(ButtonGroup, null, !!onSave && jsx(Button, {
     appearance: "primary",

package/dist/esm/ui/ContentStyles/extension.js

@@ -1,7 +1,9 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
+var _templateObject, _templateObject2;
 import { css } from '@emotion/react';
 import { akEditorDeleteBackground, akEditorDeleteBorder, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
-import { R200, R400 } from '@atlaskit/theme/colors';
+import { B400, B50, R200, R400 } from '@atlaskit/theme/colors';
+var extensionLabelStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  &.danger > span > div > .extension-label {\n    background-color: ", ";\n    color: ", ";\n    opacity: 1;\n  }\n\n  &:not(.danger).", "\n    > span\n    > div\n    > .extension-label {\n    background-color: ", ";\n    color: ", ";\n    opacity: 1;\n  }\n"])), "var(--ds-background-accent-red-subtler, ".concat(R200, ")"), "var(--ds-text-danger, ".concat(R400, ")"), akEditorSelectedNodeClassName, "var(--ds-background-selected, ".concat(B50, ")"), "var(--ds-text-selected, ".concat(B400, ")"));
+
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/design-system/no-exported-css -- Needs manual remediation
-export var extensionStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .multiBodiedExtensionView-content-wrap {\n    &.danger > span > .multiBodiedExtension--container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &.danger > span > div > .extension-label {\n      background-color: ", ";\n      color: ", ";\n    }\n\n    &:not(.danger).", " {\n      & > span > .multiBodiedExtension--container {\n        ", "\n      }\n    }\n    .multiBodiedExtension--container {\n      width: 100%;\n      max-width: 100%; // ensure width can't go over 100%;\n    }\n  }\n\n  .inlineExtensionView-content-wrap {\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    &.danger > span > div > .extension-label {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n\n  .extensionView-content-wrap,\n  .multiBodiedExtensionView-content-wrap,\n  .bodiedExtensionView-content-wrap {\n    margin: ", " 0;\n\n    &:first-of-type {\n      margin-top: 0;\n    }\n\n    &:last-of-type {\n      margin-bottom: 0;\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &.danger > span > div > .extension-label {\n      background-color: ", ";\n      color: ", ";\n    }\n\n    &.inline {\n      word-wrap: break-all;\n    }\n  }\n\n  .extensionView-content-wrap .extension-container {\n    overflow: hidden;\n  }\n\n  .bodiedExtensionView-content-wrap\n    .extensionView-content-wrap\n    .extension-container {\n    width: 100%;\n    max-width: 100%; // ensure width can't go over 100%;\n  }\n\n  [data-mark-type='fragment'] {\n    & > .extensionView-content-wrap,\n    & > .bodiedExtensionView-content-wrap {\n      margin: ", " 0;\n    }\n\n    & > [data-mark-type='dataConsumer'] {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin: ", " 0;\n      }\n    }\n\n    &:first-child {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-top: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-top: 0;\n        }\n      }\n    }\n\n    &:nth-last-of-type(-n + 2):not(:first-of-type) {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-bottom: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-bottom: 0;\n        }\n      }\n    }\n  }\n"])), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), "var(--ds-background-accent-red-subtler, ".concat(R200, ")"), "var(--ds-text-danger, ".concat(R400, ")"), akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Blanket]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), "var(--ds-background-accent-red-subtler, ".concat(R200, ")"), "var(--ds-text-danger, ".concat(R400, ")"), blockNodesVerticalMargin, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), "var(--ds-background-accent-red-subtler, ".concat(R200, ")"), "var(--ds-text-danger, ".concat(R400, ")"), blockNodesVerticalMargin, blockNodesVerticalMargin);
+export var extensionStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  .multiBodiedExtensionView-content-wrap {\n    &.danger > span > .multiBodiedExtension--container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    ", "\n\n    &:not(.danger).", " {\n      & > span > .multiBodiedExtension--container {\n        ", "\n      }\n    }\n    .multiBodiedExtension--container {\n      width: 100%;\n      max-width: 100%; // ensure width can't go over 100%;\n    }\n  }\n\n  .inlineExtensionView-content-wrap {\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    ", "\n  }\n\n  .extensionView-content-wrap,\n  .multiBodiedExtensionView-content-wrap,\n  .bodiedExtensionView-content-wrap {\n    margin: ", " 0;\n\n    &:first-of-type {\n      margin-top: 0;\n    }\n\n    &:last-of-type {\n      margin-bottom: 0;\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    ", "\n\n    &.inline {\n      word-wrap: break-all;\n    }\n  }\n\n  .extensionView-content-wrap .extension-container {\n    overflow: hidden;\n  }\n\n  .bodiedExtensionView-content-wrap\n    .extensionView-content-wrap\n    .extension-container {\n    width: 100%;\n    max-width: 100%; // ensure width can't go over 100%;\n  }\n\n  [data-mark-type='fragment'] {\n    & > .extensionView-content-wrap,\n    & > .bodiedExtensionView-content-wrap {\n      margin: ", " 0;\n    }\n\n    & > [data-mark-type='dataConsumer'] {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin: ", " 0;\n      }\n    }\n\n    &:first-child {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-top: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-top: 0;\n        }\n      }\n    }\n\n    &:nth-last-of-type(-n + 2):not(:first-of-type) {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-bottom: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-bottom: 0;\n        }\n      }\n    }\n  }\n"])), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), extensionLabelStyles, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Blanket]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), extensionLabelStyles, blockNodesVerticalMargin, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), extensionLabelStyles, blockNodesVerticalMargin, blockNodesVerticalMargin);

package/dist/esm/ui/WithHelpTrigger/index.js

@@ -24,7 +24,8 @@ var WithHelpTrigger = /*#__PURE__*/function (_React$Component) {
     }
     _this = _super.call.apply(_super, [this].concat(args));
     _defineProperty(_assertThisInitialized(_this), "openHelp", function () {
-      var editorActions = _this.context.editorActions;
+      var _ref = _this.context,
+        editorActions = _ref.editorActions;
       var dispatch = createDispatch(editorActions.eventDispatcher);
       dispatch(analyticsEventKey, {
         payload: {

package/dist/esm/version-wrapper.js

@@ -1,2 +1,2 @@
 export var name = "@atlaskit/editor-core";
-export var version = "193.5.3";
+export var version = "193.5.6";

package/dist/types/create-editor/ReactEditorView.d.ts

@@ -74,6 +74,7 @@ export declare class ReactEditorView<T = {}> extends React.Component<EditorViewP
     static contextTypes: {
         getAtlaskitAnalyticsEventHandlers: PropTypes.Requireable<(...args: any[]) => any>;
     };
+    context: EditorReactContext;
     private canDispatchTransactions;
     private focusTimeoutId?;
     private reliabilityInterval?;