@atlaskit/editor-core 193.5.7 → 193.6.4

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-core
 
+## 193.6.4
+
+### Patch Changes
+
+- [#83784](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/83784) [`b306dbd0ab06`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b306dbd0ab06) - Add border feature flag to improve contrast
+
+## 193.6.0
+
+### Minor Changes
+
+- [#83790](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/83790) [`f590476805da`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f590476805da) - [ux] Adds uniform danger overlay for macro interaction design updates
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 193.5.7
 
 ### Patch Changes

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

@@ -51,7 +51,7 @@ var commentEditorStyles = (0, _react2.css)({
   minWidth: '272px',
   height: 'auto',
   backgroundColor: "var(--ds-background-input, white)",
-  border: "1px solid ".concat("var(--ds-border, ".concat(_colors.N40, ")")),
+  border: "1px solid ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.border-checkbox_nyoiu') ? "var(--ds-border-input, ".concat(_colors.N100, ")") : "var(--ds-border, ".concat(_colors.N40, ")")),
   boxSizing: 'border-box',
   borderRadius: "".concat((0, _constants.borderRadius)(), "px"),
   maxWidth: 'inherit',

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

@@ -11,6 +11,10 @@ var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _colors = require("@atlaskit/theme/colors");
 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, ")"));
+var dangerOverlayStyles = (0, _react.css)({
+  opacity: 0.3,
+  backgroundColor: "var(--ds-background-danger-hovered, ".concat(_editorSharedStyles.akEditorDeleteBackground, ")")
+});
 
 // 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)(_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);
+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    &.danger > span > .with-danger-overlay {\n      background-color: transparent;\n      .multiBodiedExtension--overlay {\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    &.danger > span > .with-danger-overlay {\n      // If the macro turned used to turn red before, not setting the background to be transparent will cause the\n      // danger state to have two layers of red which we don't want.\n      background-color: transparent;\n      .extension-overlay {\n        ", "\n      }\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    &.danger > span > .with-danger-overlay {\n      background-color: transparent;\n      .extension-overlay {\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, dangerOverlayStyles, _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, ")"), dangerOverlayStyles, _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, dangerOverlayStyles, _editorSharedStyles.blockNodesVerticalMargin, _editorSharedStyles.blockNodesVerticalMargin);

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

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

@@ -13,7 +13,7 @@ import { ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-me
 import { tableCommentEditorStyles } from '@atlaskit/editor-plugins/table/ui/common-styles';
 import { akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
-import { N40 } from '@atlaskit/theme/colors';
+import { N100, N40 } from '@atlaskit/theme/colors';
 import { borderRadius } from '@atlaskit/theme/constants';
 import messages from '../../../messages';
 import { usePresetContext } from '../../../presets/context';
@@ -33,7 +33,7 @@ const commentEditorStyles = css({
   minWidth: '272px',
   height: 'auto',
   backgroundColor: "var(--ds-background-input, white)",
-  border: `1px solid ${`var(--ds-border, ${N40})`}`,
+  border: `1px solid ${getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? `var(--ds-border-input, ${N100})` : `var(--ds-border, ${N40})`}`,
   boxSizing: 'border-box',
   borderRadius: `${borderRadius()}px`,
   maxWidth: 'inherit',

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

@@ -17,6 +17,10 @@ const extensionLabelStyles = css`
     opacity: 1;
   }
 `;
+const dangerOverlayStyles = css({
+  opacity: 0.3,
+  backgroundColor: `var(--ds-background-danger-hovered, ${akEditorDeleteBackground})`
+});
 
 // 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`
@@ -29,6 +33,13 @@ export const extensionStyles = css`
 
     ${extensionLabelStyles}
 
+    &.danger > span > .with-danger-overlay {
+      background-color: transparent;
+      .multiBodiedExtension--overlay {
+        ${dangerOverlayStyles}
+      }
+    }
+
     &:not(.danger).${akEditorSelectedNodeClassName} {
       & > span > .multiBodiedExtension--container {
         ${getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Blanket])}
@@ -47,6 +58,15 @@ export const extensionStyles = css`
       background-color: ${`var(--ds-background-danger, ${akEditorDeleteBackground})`};
     }
 
+    &.danger > span > .with-danger-overlay {
+      // If the macro turned used to turn red before, not setting the background to be transparent will cause the
+      // danger state to have two layers of red which we don't want.
+      background-color: transparent;
+      .extension-overlay {
+        ${dangerOverlayStyles}
+      }
+    }
+
     &:not(.danger).${akEditorSelectedNodeClassName} {
       & > span > .extension-container {
         ${getSelectionStyles([SelectionStyle.BoxShadow])}
@@ -83,6 +103,13 @@ export const extensionStyles = css`
 
     ${extensionLabelStyles}
 
+    &.danger > span > .with-danger-overlay {
+      background-color: transparent;
+      .extension-overlay {
+        ${dangerOverlayStyles}
+      }
+    }
+
     &.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.7";
+export const version = "193.6.4";

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

@@ -22,7 +22,7 @@ import { ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-me
 import { tableCommentEditorStyles } from '@atlaskit/editor-plugins/table/ui/common-styles';
 import { akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
-import { N40 } from '@atlaskit/theme/colors';
+import { N100, N40 } from '@atlaskit/theme/colors';
 import { borderRadius } from '@atlaskit/theme/constants';
 import messages from '../../../messages';
 import { usePresetContext } from '../../../presets/context';
@@ -42,7 +42,7 @@ var commentEditorStyles = css({
   minWidth: '272px',
   height: 'auto',
   backgroundColor: "var(--ds-background-input, white)",
-  border: "1px solid ".concat("var(--ds-border, ".concat(N40, ")")),
+  border: "1px solid ".concat(getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? "var(--ds-border-input, ".concat(N100, ")") : "var(--ds-border, ".concat(N40, ")")),
   boxSizing: 'border-box',
   borderRadius: "".concat(borderRadius(), "px"),
   maxWidth: 'inherit',

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

@@ -4,6 +4,10 @@ import { css } from '@emotion/react';
 import { akEditorDeleteBackground, akEditorDeleteBorder, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
 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, ")"));
+var dangerOverlayStyles = css({
+  opacity: 0.3,
+  backgroundColor: "var(--ds-background-danger-hovered, ".concat(akEditorDeleteBackground, ")")
+});
 
 // 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(_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);
+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    &.danger > span > .with-danger-overlay {\n      background-color: transparent;\n      .multiBodiedExtension--overlay {\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    &.danger > span > .with-danger-overlay {\n      // If the macro turned used to turn red before, not setting the background to be transparent will cause the\n      // danger state to have two layers of red which we don't want.\n      background-color: transparent;\n      .extension-overlay {\n        ", "\n      }\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    &.danger > span > .with-danger-overlay {\n      background-color: transparent;\n      .extension-overlay {\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, dangerOverlayStyles, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Blanket]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), dangerOverlayStyles, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), extensionLabelStyles, blockNodesVerticalMargin, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), extensionLabelStyles, dangerOverlayStyles, blockNodesVerticalMargin, blockNodesVerticalMargin);

package/dist/esm/version-wrapper.js

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-core",
-  "version": "193.5.7",
+  "version": "193.6.4",
   "description": "A package contains Atlassian editor core functionality",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -45,9 +45,9 @@
     "@atlaskit/analytics-next": "^9.2.0",
     "@atlaskit/analytics-next-stable-react-context": "1.0.1",
     "@atlaskit/button": "^17.7.0",
-    "@atlaskit/editor-common": "^78.18.0",
+    "@atlaskit/editor-common": "^78.20.0",
     "@atlaskit/editor-json-transformer": "^8.10.0",
-    "@atlaskit/editor-plugins": "^1.8.0",
+    "@atlaskit/editor-plugins": "^1.9.0",
     "@atlaskit/editor-prosemirror": "3.0.0",
     "@atlaskit/editor-shared-styles": "^2.9.0",
     "@atlaskit/emoji": "^67.6.0",
@@ -89,8 +89,8 @@
     "@atlaskit/checkbox": "^13.1.0",
     "@atlaskit/collab-provider": "9.25.13",
     "@atlaskit/dropdown-menu": "^12.8.0",
-    "@atlaskit/editor-plugin-annotation": "1.5.0",
-    "@atlaskit/editor-plugin-card": "^1.2.0",
+    "@atlaskit/editor-plugin-annotation": "1.5.1",
+    "@atlaskit/editor-plugin-card": "^1.3.0",
     "@atlaskit/editor-plugin-editor-viewmode": "^1.0.0",
     "@atlaskit/editor-plugin-list": "^3.1.5",
     "@atlaskit/editor-plugin-paste": "^1.0.0",
@@ -114,7 +114,7 @@
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
     "@atlassian/feature-flags-test-utils": "^0.2.0",
     "@atlassian/link-picker-plugins": "^24.0.0",
-    "@atlassian/search-provider": "2.4.41",
+    "@atlassian/search-provider": "2.4.42",
     "@atlassian/ufo": "^0.2.0",
     "@emotion/jest": "^11.8.0",
     "@storybook/addon-knobs": "^5.3.18",
@@ -131,7 +131,7 @@
     "lz-string": "^1.4.4",
     "mockdate": "^3.0.5",
     "prettier": "^2.8.0",
-    "prosemirror-dev-tools": "^3.1.0",
+    "prosemirror-dev-tools": "^4.0.0",
     "raf-stub": "^2.0.1",
     "react": "^16.8.0",
     "react-intl-next": "npm:react-intl@^5.18.1",
@@ -192,8 +192,7 @@
       "referenceOnly": "true"
     },
     "platform.design-system-team.border-checkbox_nyoiu": {
-      "type": "boolean",
-      "referenceOnly": "true"
+      "type": "boolean"
     },
     "platform.design-system-team.editor-new-button_jjjdo": {
       "type": "boolean",