@atlaskit/editor-core 210.2.2 → 210.2.4

package/dist/es2019/ui/Appearance/FullPage/FullPageToolbarNext.js

@@ -6,14 +6,21 @@ import { useIntl } from 'react-intl-next';
 import { ContextPanelConsumer } from '@atlaskit/editor-common/context-panel';
 import { TOOLBARS } from '@atlaskit/editor-common/toolbar';
 import { ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { isToolbar } from '../../../utils/toolbar';
 import { ToolbarNext } from '../../Toolbar/Toolbar';
 import { useToolbarPortal } from '../../Toolbar/ToolbarPortal';
 const styles = {
   mainToolbarIconBefore: "_19pkpxbi _2hwxpxbi _otyrpxbi",
+  mainToolbarIconBeforeNew: "_4cvr1h6o _1e0c1txw",
   mainToolbarWrapper: "_1rjc12x7 _18zrutpp _n7zl7r9e",
-  mainToolbarWithKeyline: "_16qs9g9j"
+  mainToolbarNew: "_1e0c1txw _4t3izwfg",
+  mainToolbarWithKeyline: "_16qs9g9j",
+  customToolbarWrapperStyle: "_4cvr1h6o _1e0c1txw",
+  firstChildWrapperOneLine: "_1e0c1txw _16jlkb7n",
+  secondChildWrapperOneLine: "_1e0c1txw _1ul91ns9 _4cvr1h6o",
+  beforePrimaryToolbarComponents: "_1e0c1txw _16jlkb7n _1bahesu3 _4cvr1h6o"
 };
 const MainToolbarWrapper = ({
   children,
@@ -22,7 +29,23 @@ const MainToolbarWrapper = ({
 }) => {
   return /*#__PURE__*/React.createElement("div", {
     "data-testid": testId,
-    className: ax([styles.mainToolbarWrapper, showKeyline && styles.mainToolbarWithKeyline])
+    className: ax([styles.mainToolbarWrapper, showKeyline && styles.mainToolbarWithKeyline, expValEquals('platform_editor_toolbar_support_custom_components', 'isEnabled', true) && styles.mainToolbarNew])
+  }, children);
+};
+const FirstChildWrapper = ({
+  children
+}) => {
+  return /*#__PURE__*/React.createElement("div", {
+    "data-testid": "main-toolbar-first-child-wrapper",
+    className: ax([styles.firstChildWrapperOneLine])
+  }, children);
+};
+const SecondChildWrapper = ({
+  children
+}) => {
+  return /*#__PURE__*/React.createElement("div", {
+    "data-testid": "main-toolbar-second-child-wrapper",
+    className: ax([styles.secondChildWrapperOneLine])
   }, children);
 };
 export const FullPageToolbarNext = ({
@@ -31,7 +54,8 @@ export const FullPageToolbarNext = ({
   toolbarDockingPosition,
   editorView,
   popupsMountPoint,
-  showKeyline
+  showKeyline,
+  customPrimaryToolbarComponents
 }) => {
   var _editorAPI$toolbar, _useToolbarPortal;
   const components = editorAPI === null || editorAPI === void 0 ? void 0 : (_editorAPI$toolbar = editorAPI.toolbar) === null || _editorAPI$toolbar === void 0 ? void 0 : _editorAPI$toolbar.actions.getComponents();
@@ -80,8 +104,20 @@ export const FullPageToolbarNext = ({
     testId: "ak-editor-main-toolbar",
     showKeyline: showKeyline || ContextPanelWidth > 0
   }, beforeIcon && /*#__PURE__*/React.createElement("div", {
-    className: ax([styles.mainToolbarIconBefore])
-  }, beforeIcon), toolbarDockingPosition !== 'none' && components && isToolbar(toolbar) && /*#__PURE__*/React.createElement(ToolbarNext, {
+    className: ax([styles.mainToolbarIconBefore, expValEquals('platform_editor_toolbar_support_custom_components', 'isEnabled', true) && styles.mainToolbarIconBeforeNew])
+  }, beforeIcon), expValEquals('platform_editor_toolbar_support_custom_components', 'isEnabled', true) ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FirstChildWrapper, null, toolbarDockingPosition !== 'none' && components && isToolbar(toolbar) && /*#__PURE__*/React.createElement(ToolbarNext, {
+    toolbar: toolbar,
+    components: components,
+    editorView: editorView,
+    editorAPI: editorAPI,
+    popupsMountPoint: mountPoint,
+    editorAppearance: "full-page"
+  })), /*#__PURE__*/React.createElement(SecondChildWrapper, null, /*#__PURE__*/React.createElement("div", {
+    className: ax([styles.customToolbarWrapperStyle])
+  }, !!customPrimaryToolbarComponents && 'before' in customPrimaryToolbarComponents && /*#__PURE__*/React.createElement("div", {
+    "data-testid": 'before-primary-toolbar-components-plugin',
+    className: ax([styles.beforePrimaryToolbarComponents])
+  }, customPrimaryToolbarComponents.before), !!customPrimaryToolbarComponents && 'after' in customPrimaryToolbarComponents ? customPrimaryToolbarComponents.after : customPrimaryToolbarComponents))) : toolbarDockingPosition !== 'none' && components && isToolbar(toolbar) && /*#__PURE__*/React.createElement(ToolbarNext, {
     toolbar: toolbar,
     components: components,
     editorView: editorView,

package/dist/es2019/ui/ContentStyles/ai-panels.js

@@ -100,9 +100,9 @@ const prismBorderStyles = (colorMode, hover) => css({
 							)`
   })
 });
-
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Ignored via go/DSP-18766
-export const aiPanelStyles = colorMode => css`
+export const aiPanelStyles = (colorMode
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression
+) => css`
 	@property --panel-gradient-angle {
 		syntax: '<angle>';
 		initial-value: 270deg;

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

@@ -282,7 +282,8 @@ export const layoutStyles = viewMode => css`
 			/* Ignored via go/ees007
 			TODO: Migrate away from gridSize
 			Recommendation: Replace directly with 7px */
-			margin: ${"var(--ds-space-100, 8px)"} -${akLayoutGutterOffset + (fg('platform_editor_nested_dnd_styles_changes') ? AK_NESTED_DND_GUTTER_OFFSET : 0)}px 0;
+			margin: ${"var(--ds-space-100, 8px)"} -${akLayoutGutterOffset + (fg('platform_editor_nested_dnd_styles_changes') ? AK_NESTED_DND_GUTTER_OFFSET : 0)}px
+				0;
 			transition: border-color 0.3s ${akEditorSwoopCubicBezier};
 			cursor: ${viewMode === 'view' ? 'default' : 'pointer'};
 

package/dist/es2019/ui/EditorContentContainer/styles/annotationStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { AnnotationSharedClassNames } from '@atlaskit/editor-common/styles';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const annotationStyles = css({

package/dist/es2019/ui/EditorContentContainer/styles/blockMarksStyles.js

@@ -1,4 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const blockMarksStyles = css({

package/dist/es2019/ui/EditorContentContainer/styles/codeBlockStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { overflowShadowStyles } from './overflowShadowStyles';
 import { blanketSelectionStyles, boxShadowSelectionStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
 export const CodeBlockSharedCssClassName = {

package/dist/es2019/ui/EditorContentContainer/styles/codeMarkStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const codeMarkStyles = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766

package/dist/es2019/ui/EditorContentContainer/styles/dateStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { boxShadowSelectionStyles, dangerBorderStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
 export const DateSharedCssClassName = {
   DATE_WRAPPER: `date-lozenger-container`,

package/dist/es2019/ui/EditorContentContainer/styles/embedCardStyles.js

@@ -1,4 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export const embedCardStyles = css({

package/dist/es2019/ui/EditorContentContainer/styles/emoji.js

@@ -4,7 +4,7 @@ import { defaultEmojiHeight, EmojiSharedCssClassName } from '@atlaskit/editor-co
 import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
 import { blanketSelectionStyles, boxShadowSelectionStyles, dangerBackgroundStyles, dangerBorderStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
 const emojiSelectionStyles = css({
-  borderRadius: '2px'
+  borderRadius: "var(--ds-radius-xsmall, 2px)"
 });
 
 // Emoji node view styles

package/dist/es2019/ui/EditorContentContainer/styles/firstBlockNodeStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
 import { expandClassNames, SmartCardSharedCssClassName } from '@atlaskit/editor-common/styles';
 import { CodeBlockSharedCssClassName } from './codeBlockStyles';

package/dist/es2019/ui/EditorContentContainer/styles/gridStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export const gridStyles = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766

package/dist/es2019/ui/EditorContentContainer/styles/indentationStyles.js

@@ -1,4 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export const indentationStyles = css({

package/dist/es2019/ui/EditorContentContainer/styles/list.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 // copied from packages/editor/editor-shared-styles/src/consts/consts.ts
 const akEditorLineHeight = 1.714;
 // copied from packages/editor/editor-common/src/styles/shared/smart-card.ts

package/dist/es2019/ui/EditorContentContainer/styles/mediaStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { INLINE_IMAGE_WRAPPER_CLASS_NAME } from '@atlaskit/editor-common/media-inline';
 import { MediaSharedClassNames, richMediaClassName } from '@atlaskit/editor-common/styles';
 import { akEditorMediaResizeHandlerPadding, akEditorMediaResizeHandlerPaddingWide, akEditorSelectedBorderBoldSize, akEditorSelectedBoxShadow, akEditorSelectedNodeClassName, akEditorWrappedNodeZIndex } from '@atlaskit/editor-shared-styles';

package/dist/es2019/ui/EditorContentContainer/styles/overflowShadowStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const overflowShadowStyles = css({
   backgroundImage: `

package/dist/es2019/ui/EditorContentContainer/styles/paragraphStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 const blockNodesVerticalMargin = '0.75rem';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles

package/dist/es2019/ui/EditorContentContainer/styles/resizerStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
 export const resizerItemClassName = 'resizer-item';
 export const resizerHoverZoneClassName = 'resizer-hover-zone';

package/dist/es2019/ui/EditorContentContainer/styles/selectionStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 // TODO: ED-28075 - refactor selection styles to unblock Compiled CSS migration
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const hideNativeBrowserTextSelectionStyles = css({

package/dist/es2019/ui/EditorContentContainer/styles/shadowStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 export const shadowClassNames = {
   RIGHT_SHADOW: 'right-shadow',
   LEFT_SHADOW: 'left-shadow'

package/dist/es2019/ui/EditorContentContainer/styles/smartCardStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
 import { boxShadowSelectionStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
 export const DATASOURCE_INNER_CONTAINER_CLASSNAME = 'datasourceView-content-inner-wrap';

package/dist/es2019/ui/EditorContentContainer/styles/tasksAndDecisionsStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { blanketSelectionStyles, boxShadowSelectionStyles, dangerBackgroundStyles, dangerBorderStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
 const akEditorLineHeight = 1.714;
 const akEditorSelectedNodeClassName = 'ak-editor-selected-node';

package/dist/es2019/ui/EditorContentContainer/styles/textColorStyles.js

@@ -1,4 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export const textColorStyles = css({

package/dist/es2019/ui/EditorContentContainer/styles/unsupportedStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { backgroundSelectionStyles, borderSelectionStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
 export const UnsupportedSharedCssClassName = {
   BLOCK_CONTAINER: 'unsupportedBlockView-content-wrap',

package/dist/es2019/ui/EditorContentContainer/styles/whitespaceStyles.js

@@ -1,4 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const whitespaceStyles = css({

package/dist/es2019/version-wrapper.js

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

package/dist/esm/create-editor/ReactEditorView.js

@@ -775,4 +775,7 @@ export function ReactEditorView(props) {
     editorAPI: editorAPI
   })) !== null && _props$render !== void 0 ? _props$render : editor : editor);
 }
+
+// Preserving exact type generated by TypeScript
+// eslint-disable-next-line @typescript-eslint/ban-types
 export default injectIntl(ReactEditorView);

package/dist/esm/ui/Addon/click-area-helper.js

@@ -3,6 +3,7 @@ import { addParagraphAtEnd } from '@atlaskit/editor-common/commands';
 import { setSelectionTopLevelBlocks } from '@atlaskit/editor-common/selection';
 import { closestElement } from '@atlaskit/editor-common/utils';
 import { fg } from '@atlaskit/platform-feature-flags';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ignoreAttribute } from './ClickAreaBlock/contentComponentWrapper';
 
 // we ignore all of the clicks made inside <div class="ak-editor-content-area" /> (but not clicks on the node itself)
@@ -41,7 +42,7 @@ export var checkForModal = function checkForModal(target) {
   return true;
 };
 var clickAreaClickHandler = function clickAreaClickHandler(view, event) {
-  var _view$hasFocus, _target$parentElement, _event$currentTarget;
+  var _view$hasFocus, _target$parentElement, _event$currentTarget, _event$currentTarget2;
   var isEditorFocused = !!(view !== null && view !== void 0 && (_view$hasFocus = view.hasFocus) !== null && _view$hasFocus !== void 0 && _view$hasFocus.call(view));
   if (!(event.target instanceof HTMLElement)) {
     return;
@@ -82,7 +83,8 @@ var clickAreaClickHandler = function clickAreaClickHandler(view, event) {
   // This is a super workaround to find when events are coming from Confluence InlineComment modal
   // We don't own those components, so we can't change them
   var isEventComingFromInlineCommentPopup = Boolean(closestElement(event.currentTarget, 'div[offset]')) || Boolean(closestElement(target, 'div[offset]'));
-  var isButtonClicked = Boolean(closestElement(event.currentTarget, 'button')) || Boolean(closestElement(target, 'button')) || ((_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 ? void 0 : _event$currentTarget.nodeName) === 'BUTTON' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'BUTTON';
+  var isAnchorButtonClicked = Boolean(closestElement(event.currentTarget, 'a')) || Boolean(closestElement(target, 'a')) || ((_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 ? void 0 : _event$currentTarget.nodeName) === 'A' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'A';
+  var isButtonClicked = Boolean(closestElement(event.currentTarget, 'button')) || Boolean(closestElement(target, 'button')) || ((_event$currentTarget2 = event.currentTarget) === null || _event$currentTarget2 === void 0 ? void 0 : _event$currentTarget2.nodeName) === 'BUTTON' || (target === null || target === void 0 ? void 0 : target.nodeName) === 'BUTTON' || expValEquals('platform_editor_toolbar_migrate_loom', 'isEnabled', true) && isAnchorButtonClicked;
   var isTargetInsideContentArea = Boolean(isTargetChildOfContentArea);
   var isBetweenContentAreaAndEditableContent = isTargetInsideContentArea && !isTargetInsideEditableArea;
 

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

@@ -179,7 +179,8 @@ export var FullPageEditor = function FullPageEditor(props) {
     popupsMountPoint: props.popupsMountPoint,
     popupsBoundariesElement: props.popupsBoundariesElement,
     popupsScrollableElement: props.popupsScrollableElement,
-    showKeyline: showKeyline
+    showKeyline: showKeyline,
+    customPrimaryToolbarComponents: props.customPrimaryToolbarComponents
   })) : jsx(FullPageToolbar, {
     appearance: props.appearance,
     editorAPI: editorAPI,

package/dist/esm/ui/Appearance/FullPage/FullPageToolbarNext.compiled.css

@@ -1,7 +1,13 @@
 
 ._18zrutpp{padding-inline:var(--ds-space-150,9pt)}
 ._1rjc12x7{padding-block:var(--ds-space-075,6px)}
-._n7zl7r9e{border-bottom:var(--ds-border-width,1px) solid var(--ds-border,#091e4224)}._16qs9g9j{box-shadow:var(--ds-shadow-overflow,0 0 8px #091e4228,0 0 1px #091e421e)}
+._n7zl7r9e{border-bottom:var(--ds-border-width,1px) solid var(--ds-border,#091e4224)}._16jlkb7n{flex-grow:1}
+._16qs9g9j{box-shadow:var(--ds-shadow-overflow,0 0 8px #091e4228,0 0 1px #091e421e)}
 ._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
+._1bahesu3{justify-content:flex-end}
+._1e0c1txw{display:flex}
+._1ul91ns9{min-width:-moz-fit-content;min-width:fit-content}
 ._2hwxpxbi{margin-right:var(--ds-space-200,1pc)}
+._4cvr1h6o{align-items:center}
+._4t3izwfg{height:2pc}
 ._otyrpxbi{margin-bottom:var(--ds-space-200,1pc)}

package/dist/esm/ui/Appearance/FullPage/FullPageToolbarNext.js

@@ -6,14 +6,21 @@ import { useIntl } from 'react-intl-next';
 import { ContextPanelConsumer } from '@atlaskit/editor-common/context-panel';
 import { TOOLBARS } from '@atlaskit/editor-common/toolbar';
 import { ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { isToolbar } from '../../../utils/toolbar';
 import { ToolbarNext } from '../../Toolbar/Toolbar';
 import { useToolbarPortal } from '../../Toolbar/ToolbarPortal';
 var styles = {
   mainToolbarIconBefore: "_19pkpxbi _2hwxpxbi _otyrpxbi",
+  mainToolbarIconBeforeNew: "_4cvr1h6o _1e0c1txw",
   mainToolbarWrapper: "_1rjc12x7 _18zrutpp _n7zl7r9e",
-  mainToolbarWithKeyline: "_16qs9g9j"
+  mainToolbarNew: "_1e0c1txw _4t3izwfg",
+  mainToolbarWithKeyline: "_16qs9g9j",
+  customToolbarWrapperStyle: "_4cvr1h6o _1e0c1txw",
+  firstChildWrapperOneLine: "_1e0c1txw _16jlkb7n",
+  secondChildWrapperOneLine: "_1e0c1txw _1ul91ns9 _4cvr1h6o",
+  beforePrimaryToolbarComponents: "_1e0c1txw _16jlkb7n _1bahesu3 _4cvr1h6o"
 };
 var MainToolbarWrapper = function MainToolbarWrapper(_ref) {
   var children = _ref.children,
@@ -21,17 +28,32 @@ var MainToolbarWrapper = function MainToolbarWrapper(_ref) {
     showKeyline = _ref.showKeyline;
   return /*#__PURE__*/React.createElement("div", {
     "data-testid": testId,
-    className: ax([styles.mainToolbarWrapper, showKeyline && styles.mainToolbarWithKeyline])
+    className: ax([styles.mainToolbarWrapper, showKeyline && styles.mainToolbarWithKeyline, expValEquals('platform_editor_toolbar_support_custom_components', 'isEnabled', true) && styles.mainToolbarNew])
   }, children);
 };
-export var FullPageToolbarNext = function FullPageToolbarNext(_ref2) {
+var FirstChildWrapper = function FirstChildWrapper(_ref2) {
+  var children = _ref2.children;
+  return /*#__PURE__*/React.createElement("div", {
+    "data-testid": "main-toolbar-first-child-wrapper",
+    className: ax([styles.firstChildWrapperOneLine])
+  }, children);
+};
+var SecondChildWrapper = function SecondChildWrapper(_ref3) {
+  var children = _ref3.children;
+  return /*#__PURE__*/React.createElement("div", {
+    "data-testid": "main-toolbar-second-child-wrapper",
+    className: ax([styles.secondChildWrapperOneLine])
+  }, children);
+};
+export var FullPageToolbarNext = function FullPageToolbarNext(_ref4) {
   var _editorAPI$toolbar, _useToolbarPortal;
-  var editorAPI = _ref2.editorAPI,
-    beforeIcon = _ref2.beforeIcon,
-    toolbarDockingPosition = _ref2.toolbarDockingPosition,
-    editorView = _ref2.editorView,
-    popupsMountPoint = _ref2.popupsMountPoint,
-    showKeyline = _ref2.showKeyline;
+  var editorAPI = _ref4.editorAPI,
+    beforeIcon = _ref4.beforeIcon,
+    toolbarDockingPosition = _ref4.toolbarDockingPosition,
+    editorView = _ref4.editorView,
+    popupsMountPoint = _ref4.popupsMountPoint,
+    showKeyline = _ref4.showKeyline,
+    customPrimaryToolbarComponents = _ref4.customPrimaryToolbarComponents;
   var components = editorAPI === null || editorAPI === void 0 || (_editorAPI$toolbar = editorAPI.toolbar) === null || _editorAPI$toolbar === void 0 ? void 0 : _editorAPI$toolbar.actions.getComponents();
   var intl = useIntl();
   var toolbar = components === null || components === void 0 ? void 0 : components.find(function (component) {
@@ -40,10 +62,10 @@ export var FullPageToolbarNext = function FullPageToolbarNext(_ref2) {
 
   // When a toolbar portal context is provided, render the  toolbar inside a portal.
   // Otherwise fall back to a fragment just to avoid forking rendering logic.
-  var _ref3 = (_useToolbarPortal = useToolbarPortal()) !== null && _useToolbarPortal !== void 0 ? _useToolbarPortal : {
+  var _ref5 = (_useToolbarPortal = useToolbarPortal()) !== null && _useToolbarPortal !== void 0 ? _useToolbarPortal : {
       Portal: React.Fragment
     },
-    ToolbarPortal = _ref3.Portal;
+    ToolbarPortal = _ref5.Portal;
   var hasToolbarPortal = ToolbarPortal !== React.Fragment;
   var mountPoint = hasToolbarPortal ? undefined : popupsMountPoint;
   var isShortcutToFocusToolbarRaw = function isShortcutToFocusToolbarRaw(event) {
@@ -67,8 +89,8 @@ export var FullPageToolbarNext = function FullPageToolbarNext(_ref2) {
     event.stopPropagation();
   }, [editorView]);
   var handleEscape = expValEqualsNoExposure('platform_editor_toolbar_rerender_optimization_exp', 'isEnabled', true) ? handleEscapeMemoized : handleEscapeRaw;
-  return /*#__PURE__*/React.createElement(ContextPanelConsumer, null, function (_ref4) {
-    var ContextPanelWidth = _ref4.width;
+  return /*#__PURE__*/React.createElement(ContextPanelConsumer, null, function (_ref6) {
+    var ContextPanelWidth = _ref6.width;
     return /*#__PURE__*/React.createElement(ToolbarArrowKeyNavigationProvider, {
       editorView: editorView,
       childComponentSelector: "[data-testid='ak-editor-main-toolbar']",
@@ -79,8 +101,20 @@ export var FullPageToolbarNext = function FullPageToolbarNext(_ref2) {
       testId: "ak-editor-main-toolbar",
       showKeyline: showKeyline || ContextPanelWidth > 0
     }, beforeIcon && /*#__PURE__*/React.createElement("div", {
-      className: ax([styles.mainToolbarIconBefore])
-    }, beforeIcon), toolbarDockingPosition !== 'none' && components && isToolbar(toolbar) && /*#__PURE__*/React.createElement(ToolbarNext, {
+      className: ax([styles.mainToolbarIconBefore, expValEquals('platform_editor_toolbar_support_custom_components', 'isEnabled', true) && styles.mainToolbarIconBeforeNew])
+    }, beforeIcon), expValEquals('platform_editor_toolbar_support_custom_components', 'isEnabled', true) ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FirstChildWrapper, null, toolbarDockingPosition !== 'none' && components && isToolbar(toolbar) && /*#__PURE__*/React.createElement(ToolbarNext, {
+      toolbar: toolbar,
+      components: components,
+      editorView: editorView,
+      editorAPI: editorAPI,
+      popupsMountPoint: mountPoint,
+      editorAppearance: "full-page"
+    })), /*#__PURE__*/React.createElement(SecondChildWrapper, null, /*#__PURE__*/React.createElement("div", {
+      className: ax([styles.customToolbarWrapperStyle])
+    }, !!customPrimaryToolbarComponents && 'before' in customPrimaryToolbarComponents && /*#__PURE__*/React.createElement("div", {
+      "data-testid": 'before-primary-toolbar-components-plugin',
+      className: ax([styles.beforePrimaryToolbarComponents])
+    }, customPrimaryToolbarComponents.before), !!customPrimaryToolbarComponents && 'after' in customPrimaryToolbarComponents ? customPrimaryToolbarComponents.after : customPrimaryToolbarComponents))) : toolbarDockingPosition !== 'none' && components && isToolbar(toolbar) && /*#__PURE__*/React.createElement(ToolbarNext, {
       toolbar: toolbar,
       components: components,
       editorView: editorView,

package/dist/esm/ui/ContentStyles/ai-panels.js

@@ -80,8 +80,8 @@ var prismBorderStyles = function prismBorderStyles(colorMode, hover) {
     background: "conic-gradient(\n\t\t\t\t\t\t\t\tfrom var(--panel-gradient-angle, 270deg),\n\t\t\t\t\t\t\t\t".concat(aiPrismColor['prism.border.step.1'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 0%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.2'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 20%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.3'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 50%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.4'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 56%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.1'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 100%\n\t\t\t\t\t\t\t)")
   }));
 };
-
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Ignored via go/DSP-18766
-export var aiPanelStyles = function aiPanelStyles(colorMode) {
+export var aiPanelStyles = function aiPanelStyles(colorMode
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression
+) {
   return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t@property --panel-gradient-angle {\n\t\tsyntax: '<angle>';\n\t\tinitial-value: 270deg;\n\t\tinherits: false;\n\t}\n\n\tdiv[extensionType='com.atlassian.ai-blocks'] {\n\t\t/* This hides the label for the extension */\n\t\t.extension-label {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\t/* This styles the ai panel correctly when its just sitting on the page and there\n\t\tis no user interaction */\n\t\t.extension-container {\n\t\t\tposition: relative;\n\t\t\tbox-shadow: none;\n\t\t\toverflow: unset;\n\t\t\tbackground-color: ", " !important;\n\t\t\t&::before,\n\t\t\t&::after {\n\t\t\t\t", "\n\t\t\t}\n\t\t\t&.with-hover-border {\n\t\t\t\t&::before,\n\t\t\t\t&::after {\n\t\t\t\t\t", "\n\t\t\t\t}\n\t\t\t}\n\t\t\t& .with-margin-styles {\n\t\t\t\tbackground-color: ", " !important;\n\t\t\t\tborder-radius: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t/* This styles the ai panel correctly when its streaming */\n\tdiv[extensionType='com.atlassian.ai-blocks']:has(.streaming) {\n\t\t.extension-container {\n\t\t\tbox-shadow: none;\n\t\t\toverflow: unset;\n\t\t\t", "\n\t\t\t&::before,\n\t\t\t&::after {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\t}\n\n\t/* This styles the ai panel correctly when a user is hovering over the delete button in the floating panel */\n\tdiv[extensionType='com.atlassian.ai-blocks'].danger {\n\t\t.extension-container {\n\t\t\tbox-shadow: 0 0 0 1px ", ";\n\t\t}\n\t}\n\n\t/* This removes the margin from the action list when inside an ai panel */\n\tdiv[extensiontype='com.atlassian.ai-blocks'][extensionkey='ai-action-items-block:aiActionItemsBodiedExtension'] {\n\t\tdiv[data-node-type='actionList'] {\n\t\t\tmargin: 0 !important;\n\t\t}\n\t}\n"])), "var(--ds-surface, #FFFFFF)", prismBorderStyles(colorMode), prismBorderStyles(colorMode, true), "var(--ds-surface, #FFFFFF)", "var(--ds-border-radius-100, 3px)", prismBorderAnimationStyles, prismBorderStyles(colorMode), "var(--ds-border-danger, #E2483D)");
 };

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

@@ -70,5 +70,5 @@ var layoutResponsiveStyles = function layoutResponsiveStyles(viewMode) {
 
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
 export var layoutStyles = function layoutStyles(viewMode) {
-  return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", "\n\t\t[data-layout-section] {\n\t\t\t/* Ignored via go/ees007\n\t\t\tTODO: Migrate away from gridSize\n\t\t\tRecommendation: Replace directly with 7px */\n\t\t\tmargin: ", " -", "px 0;\n\t\t\ttransition: border-color 0.3s ", ";\n\t\t\tcursor: ", ";\n\n\t\t\t/* Inner cursor located 26px from left */\n\t\t\t[data-layout-column] {\n\t\t\t\tflex: 1;\n\t\t\t\tposition: relative;\n\n\t\t\t\tmin-width: 0;\n\t\t\t\t/* disable 4 borders when in view mode and advanced layouts is on */\n\t\t\t\tborder: ", "px\n\t\t\t\t\tsolid ", ";\n\t\t\t\tborder-radius: 4px;\n\t\t\t\tpadding: ", "px\n\t\t\t\t\t", "px;\n\t\t\t\tbox-sizing: border-box;\n\n\t\t\t\t> div {\n\t\t\t\t\t", "\n\n\t\t\t\t\t> .embedCardView-content-wrap:first-of-type .rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .mediaSingleView-content-wrap:first-of-type .rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .ProseMirror-gapcursor.-right:first-child\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> style:first-child\n\t\t\t\t\t\t+ .ProseMirror-gapcursor.-right\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> .ProseMirror-gapcursor.-right:first-of-type\n\t\t\t\t\t\t+ .embedCardView-content-wrap\n\t\t\t\t\t\t.rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .ProseMirror-gapcursor:first-child\n\t\t\t\t\t\t+ span\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> style:first-child\n\t\t\t\t\t\t+ .ProseMirror-gapcursor\n\t\t\t\t\t\t+ span\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t/* Prevent first DecisionWrapper's margin-top: 8px from shifting decisions down\n             and shrinking layout's node selectable area (leniency margin) */\n\t\t\t\t\t> [data-node-type='decisionList'] {\n\t\t\t\t\t\tli:first-of-type [data-decision-wrapper] {\n\t\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t/* Make the 'content' fill the entire height of the layout column to allow click\n           handler of layout section nodeview to target only data-layout-column */\n\t\t\t\t[data-layout-content] {\n\t\t\t\t\theight: 100%;\n\t\t\t\t\tcursor: text;\n\t\t\t\t\t.mediaGroupView-content-wrap {\n\t\t\t\t\t\tclear: both;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t", "\n\t\t}\n\n\t\t/* styles to support borders for layout */\n\t\t[data-layout-section],\n\t\t.layoutSectionView-content-wrap {\n\t\t\t", "\n\t\t}\n\t}\n\n\t", "\n\n\t/* hide separator when element is dragging on top of a layout column */\n\t[data-blocks-drop-target-container] ~ [data-layout-column] > [data-layout-content]::before {\n\t\tdisplay: none;\n\t}\n\n\t.fabric-editor--full-width-mode .ProseMirror {\n\t\t[data-layout-section] {\n\t\t\t.", " {\n\t\t\t\tmargin: 0 ", "px;\n\t\t\t}\n\t\t}\n\t}\n\n\t", "\n"])), layoutSectionStyles(), "var(--ds-space-100, 8px)", akLayoutGutterOffset + (fg('platform_editor_nested_dnd_styles_changes') ? AK_NESTED_DND_GUTTER_OFFSET : 0), akEditorSwoopCubicBezier, viewMode === 'view' ? 'default' : 'pointer', viewMode === 'view' || editorExperiment('advanced_layouts', true) ? 0 : akEditorSelectedBorderSize, "var(--ds-border, #091E4224)", LAYOUT_COLUMN_PADDING, LAYOUT_COLUMN_PADDING + (fg('platform_editor_nested_dnd_styles_changes') ? 8 : 0), firstNodeWithNotMarginTop(), layoutColumnStyles(), editorExperiment('advanced_layouts', true) ? layoutWithSeparatorBorderStyles(viewMode) : layoutBorderStyles(viewMode), editorExperiment('advanced_layouts', true) && layoutResponsiveStyles(viewMode), TableCssClassName.TABLE_CONTAINER, "var(--ds-space-025, 2px)", editorExperiment('advanced_layouts', false) && fg('platform_editor_nested_dnd_styles_changes') && ".ak-editor-content-area.appearance-full-page .ProseMirror [data-layout-section] {\n\t\t\t\tmargin: ".concat("var(--ds-space-100, 8px)", " -", akLayoutGutterOffset + 8, "px 0;\n\t\t\t\t}"));
+  return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", "\n\t\t[data-layout-section] {\n\t\t\t/* Ignored via go/ees007\n\t\t\tTODO: Migrate away from gridSize\n\t\t\tRecommendation: Replace directly with 7px */\n\t\t\tmargin: ", " -", "px\n\t\t\t\t0;\n\t\t\ttransition: border-color 0.3s ", ";\n\t\t\tcursor: ", ";\n\n\t\t\t/* Inner cursor located 26px from left */\n\t\t\t[data-layout-column] {\n\t\t\t\tflex: 1;\n\t\t\t\tposition: relative;\n\n\t\t\t\tmin-width: 0;\n\t\t\t\t/* disable 4 borders when in view mode and advanced layouts is on */\n\t\t\t\tborder: ", "px\n\t\t\t\t\tsolid ", ";\n\t\t\t\tborder-radius: 4px;\n\t\t\t\tpadding: ", "px\n\t\t\t\t\t", "px;\n\t\t\t\tbox-sizing: border-box;\n\n\t\t\t\t> div {\n\t\t\t\t\t", "\n\n\t\t\t\t\t> .embedCardView-content-wrap:first-of-type .rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .mediaSingleView-content-wrap:first-of-type .rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .ProseMirror-gapcursor.-right:first-child\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> style:first-child\n\t\t\t\t\t\t+ .ProseMirror-gapcursor.-right\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> .ProseMirror-gapcursor.-right:first-of-type\n\t\t\t\t\t\t+ .embedCardView-content-wrap\n\t\t\t\t\t\t.rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t> .ProseMirror-gapcursor:first-child\n\t\t\t\t\t\t+ span\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item,\n\t\t\t\t\t> style:first-child\n\t\t\t\t\t\t+ .ProseMirror-gapcursor\n\t\t\t\t\t\t+ span\n\t\t\t\t\t\t+ .mediaSingleView-content-wrap\n\t\t\t\t\t\t.rich-media-item {\n\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t/* Prevent first DecisionWrapper's margin-top: 8px from shifting decisions down\n             and shrinking layout's node selectable area (leniency margin) */\n\t\t\t\t\t> [data-node-type='decisionList'] {\n\t\t\t\t\t\tli:first-of-type [data-decision-wrapper] {\n\t\t\t\t\t\t\tmargin-top: 0;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t/* Make the 'content' fill the entire height of the layout column to allow click\n           handler of layout section nodeview to target only data-layout-column */\n\t\t\t\t[data-layout-content] {\n\t\t\t\t\theight: 100%;\n\t\t\t\t\tcursor: text;\n\t\t\t\t\t.mediaGroupView-content-wrap {\n\t\t\t\t\t\tclear: both;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t", "\n\t\t}\n\n\t\t/* styles to support borders for layout */\n\t\t[data-layout-section],\n\t\t.layoutSectionView-content-wrap {\n\t\t\t", "\n\t\t}\n\t}\n\n\t", "\n\n\t/* hide separator when element is dragging on top of a layout column */\n\t[data-blocks-drop-target-container] ~ [data-layout-column] > [data-layout-content]::before {\n\t\tdisplay: none;\n\t}\n\n\t.fabric-editor--full-width-mode .ProseMirror {\n\t\t[data-layout-section] {\n\t\t\t.", " {\n\t\t\t\tmargin: 0 ", "px;\n\t\t\t}\n\t\t}\n\t}\n\n\t", "\n"])), layoutSectionStyles(), "var(--ds-space-100, 8px)", akLayoutGutterOffset + (fg('platform_editor_nested_dnd_styles_changes') ? AK_NESTED_DND_GUTTER_OFFSET : 0), akEditorSwoopCubicBezier, viewMode === 'view' ? 'default' : 'pointer', viewMode === 'view' || editorExperiment('advanced_layouts', true) ? 0 : akEditorSelectedBorderSize, "var(--ds-border, #091E4224)", LAYOUT_COLUMN_PADDING, LAYOUT_COLUMN_PADDING + (fg('platform_editor_nested_dnd_styles_changes') ? 8 : 0), firstNodeWithNotMarginTop(), layoutColumnStyles(), editorExperiment('advanced_layouts', true) ? layoutWithSeparatorBorderStyles(viewMode) : layoutBorderStyles(viewMode), editorExperiment('advanced_layouts', true) && layoutResponsiveStyles(viewMode), TableCssClassName.TABLE_CONTAINER, "var(--ds-space-025, 2px)", editorExperiment('advanced_layouts', false) && fg('platform_editor_nested_dnd_styles_changes') && ".ak-editor-content-area.appearance-full-page .ProseMirror [data-layout-section] {\n\t\t\t\tmargin: ".concat("var(--ds-space-100, 8px)", " -", akLayoutGutterOffset + 8, "px 0;\n\t\t\t\t}"));
 };

package/dist/esm/ui/EditorContentContainer/styles/annotationStyles.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { AnnotationSharedClassNames } from '@atlaskit/editor-common/styles';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export var annotationStyles = css({

package/dist/esm/ui/EditorContentContainer/styles/blockMarksStyles.js

@@ -1,4 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export var blockMarksStyles = css({

package/dist/esm/ui/EditorContentContainer/styles/codeBlockStyles.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { overflowShadowStyles } from './overflowShadowStyles';
 import { blanketSelectionStyles, boxShadowSelectionStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
 export var CodeBlockSharedCssClassName = {

package/dist/esm/ui/EditorContentContainer/styles/codeMarkStyles.js

@@ -1,5 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export var codeMarkStyles = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766

package/dist/esm/ui/EditorContentContainer/styles/dateStyles.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 import { boxShadowSelectionStyles, dangerBorderStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
 export var DateSharedCssClassName = {
   DATE_WRAPPER: "date-lozenger-container",

package/dist/esm/ui/EditorContentContainer/styles/embedCardStyles.js

@@ -1,4 +1,5 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export var embedCardStyles = css({

package/dist/esm/ui/EditorContentContainer/styles/emoji.js

@@ -5,7 +5,7 @@ import { defaultEmojiHeight, EmojiSharedCssClassName } from '@atlaskit/editor-co
 import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
 import { blanketSelectionStyles, boxShadowSelectionStyles, dangerBackgroundStyles, dangerBorderStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
 var emojiSelectionStyles = css({
-  borderRadius: '2px'
+  borderRadius: "var(--ds-radius-xsmall, 2px)"
 });
 
 // Emoji node view styles