@atlaskit/editor-core 210.2.1 → 210.2.3

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

@@ -1,9 +1,10 @@
-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';
 import { fileCardImageViewSelector, inlinePlayerClassName, newFileExperienceClassName } from '@atlaskit/media-card';
+import { dangerBorderStyles } from './selectionStyles';
 const wrappedMediaBreakoutPoint = 410;
 
 /**
@@ -356,6 +357,17 @@ export const mediaStyles = css({
   }
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const mediaDangerStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.ProseMirror': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
+    [`.mediaInlineView-content-wrap.${akEditorSelectedNodeClassName}.danger .${INLINE_IMAGE_WRAPPER_CLASS_NAME}`]:
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
+    [dangerBorderStyles]
+  }
+});
+
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const mediaGroupStyles = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors

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

@@ -2,7 +2,7 @@
 import { css } from '@emotion/react';
 import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
 import { akEditorDeleteBorder, akEditorSelectedBorderSize, akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
-import { backgroundSelectionStyles, boxShadowSelectionStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
+import { backgroundSelectionStyles, boxShadowSelectionStyles, dangerBackgroundStyles, dangerBorderStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
 
 /* need to specify dark text colour because personal mentions
 (in dark blue) have white text by default */
@@ -161,4 +161,19 @@ export const mentionsSelectionStylesWithSearchMatch = css({
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     boxShadowSelectionStyles]
   }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const mentionDangerStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
+  [`.${akEditorSelectedNodeClassName}:not(.search-match-block).danger`]: {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '> .editor-mention-primitive, > .editor-mention-primitive.mention-self, > .editor-mention-primitive.mention-restricted':
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values,
+    [
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
+    dangerBorderStyles,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    dangerBackgroundStyles]
+  }
 });

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/rule.js

@@ -19,4 +19,12 @@ export const ruleStyles = css({
     outline: 'none',
     backgroundColor: "var(--ds-border-selected, #0C66E4)"
   }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const dangerRuleStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
+  [`.ProseMirror hr.${akEditorSelectedNodeClassName}.danger`]: {
+    backgroundColor: "var(--ds-border-danger, #E2483D)"
+  }
 });

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({
@@ -108,4 +108,14 @@ export const selectedNodeStyles = css({
   '.ProseMirror-selectednode:empty': {
     outline: `2px solid ${"var(--ds-border-focused, #388BFF)"}`
   }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const dangerBorderStyles = css({
+  boxShadow: `0 0 0 1px ${"var(--ds-border-danger, #E2483D)"}`
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const dangerBackgroundStyles = css({
+  backgroundColor: "var(--ds-background-danger, #FFECEB)"
 });

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';
@@ -323,6 +323,159 @@ export const smartCardStylesWithSearchMatch = css({
   }
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export const smartCardStylesWithSearchMatchAndBlockMenuDangerStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
+  [`.${SmartCardSharedCssClassName.INLINE_CARD_CONTAINER}`]: {
+    maxWidth: 'calc(100% - 20px)',
+    verticalAlign: 'top',
+    wordBreak: 'break-all',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.card-with-comment': {
+      background: "var(--ds-background-accent-yellow-subtler, #F8E6A0)",
+      borderBottom: `2px solid ${"var(--ds-border-accent-yellow, #B38600)"}`,
+      boxShadow: "var(--ds-shadow-overlay, 0px 8px 12px #091E4226, 0px 0px 1px #091E424f)"
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.card': {
+      paddingLeft: "var(--ds-space-025, 2px)",
+      paddingRight: "var(--ds-space-025, 2px)",
+      paddingTop: "var(--ds-space-100, 0.5em)",
+      paddingBottom: "var(--ds-space-100, 0.5em)",
+      marginBottom: "var(--ds-space-negative-100, -0.5em)",
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+      [`.${SmartCardSharedCssClassName.LOADER_WRAPPER} > a:focus`]: [
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+      boxShadowSelectionStyles,
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+      hideNativeBrowserTextSelectionStyles]
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+    [`&.ak-editor-selected-node .${SmartCardSharedCssClassName.LOADER_WRAPPER} > a`]: [
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    hideNativeBrowserTextSelectionStyles],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+    [`&.ak-editor-selected-node:not(.search-match-block):not(.danger) .${SmartCardSharedCssClassName.LOADER_WRAPPER} > a`]:
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+    [
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    boxShadowSelectionStyles],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
+    [`.${SmartCardSharedCssClassName.LOADER_WRAPPER} > a`]: {
+      // EDM-1717: box-shadow Safari fix start
+      zIndex: 1,
+      position: 'relative'
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&.danger': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
+      [`.${SmartCardSharedCssClassName.LOADER_WRAPPER} > a`]: {
+        boxShadow: `0 0 0 1px ${"var(--ds-border-danger, #E2483D)"}`,
+        // EDM-1717: box-shadow Safari fix start
+        zIndex: 2
+        // EDM-1717: box-shadow Safari fix end
+      }
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
+  [`.${SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER}`]: {
+    display: 'block',
+    margin: '0.75rem 0 0',
+    maxWidth: `${8 * 95}px`,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+    [`&.ak-editor-selected-node .${SmartCardSharedCssClassName.LOADER_WRAPPER} > div`]: [
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    boxShadowSelectionStyles,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    hideNativeBrowserTextSelectionStyles, {
+      borderRadius: "var(--ds-border-radius-200, 8px)"
+    }],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&.danger': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
+      [`.${SmartCardSharedCssClassName.LOADER_WRAPPER} > div`]: {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
+        boxShadow: `0 0 0 1px ${"var(--ds-border-danger, #E2483D)"} !important`
+      }
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
+  [`.${SmartCardSharedCssClassName.DATASOURCE_CONTAINER}.${SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER}`]: {
+    maxWidth: '100%',
+    display: 'flex',
+    justifyContent: 'center',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
+    [`.${DATASOURCE_INNER_CONTAINER_CLASSNAME}`]: {
+      cursor: 'pointer',
+      backgroundColor: "var(--ds-background-neutral-subtle, #00000000)",
+      borderRadius: "var(--ds-border-radius-200, 8px)",
+      border: `1px solid ${"var(--ds-border, #091E4224)"}`,
+      overflow: 'hidden'
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&.ak-editor-selected-node': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+      [`.${DATASOURCE_INNER_CONTAINER_CLASSNAME}`]: [
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+      boxShadowSelectionStyles,
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+      hideNativeBrowserTextSelectionStyles, {
+        'input::selection': {
+          backgroundColor: "var(--ds-background-selected-hovered, #CCE0FF)"
+        },
+        'input::-moz-selection': {
+          backgroundColor: "var(--ds-background-selected-hovered, #CCE0FF)"
+        }
+      }]
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&.danger': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
+      [`.${DATASOURCE_INNER_CONTAINER_CLASSNAME}`]: {
+        boxShadow: `0 0 0 1px ${"var(--ds-border-danger, #E2483D)"}`
+      }
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
+  [`.${SmartCardSharedCssClassName.EMBED_CARD_CONTAINER}`]: {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
+    [`.${SmartCardSharedCssClassName.LOADER_WRAPPER} > div`]: {
+      cursor: 'pointer',
+      '&::after': {
+        transition: 'box-shadow 0s'
+      }
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+    [`&.ak-editor-selected-node .${SmartCardSharedCssClassName.LOADER_WRAPPER} > div::after`]: [
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    hideNativeBrowserTextSelectionStyles],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+    [`&.ak-editor-selected-node:not(.search-match-block) .${SmartCardSharedCssClassName.LOADER_WRAPPER} > div::after`]:
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+    [
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    boxShadowSelectionStyles],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&.danger': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '.media-card-frame::after': {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
+        boxShadow: `0 0 0 1px ${"var(--ds-border-danger, #E2483D)"} !important`,
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
+        background: `${"var(--ds-background-danger, #FFECEB)"} !important`
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '.richMedia-resize-handle-right::after, .richMedia-resize-handle-left::after': {
+        background: "var(--ds-border-danger, #E2483D)"
+      }
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-values
+  [`.${FLOATING_TOOLBAR_LINKPICKER_CLASSNAME}`]: {
+    padding: 0
+  }
+});
+
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const smartCardStylesWithSearchMatchAndPreviewPanelResponsiveness = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-container-queries, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values

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

@@ -164,6 +164,18 @@ export const statusStylesMixin_fg_platform_component_visual_refresh_with_search_
   }
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const statusDangerStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '.statusView-content-wrap:not(.search-match-block)': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&.ak-editor-selected-node.danger .status-lozenge-span > span': {
+      boxShadow: `0 0 0 2px ${"var(--ds-border-danger, #E2483D)"}`
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    }
+  }
+});
+
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const statusStylesMixin_without_fg_platform_component_visual_refresh = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors

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

@@ -1,6 +1,6 @@
-import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
-
-import { blanketSelectionStyles, boxShadowSelectionStyles, hideNativeBrowserTextSelectionStyles } from './selectionStyles';
+// 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';
 export const TaskDecisionSharedCssClassName = {
@@ -169,6 +169,14 @@ export const decisionStyles = css({
   }
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const decisionDangerStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-nested-selectors
+  [`.${akEditorSelectedNodeClassName}.danger > [data-decision-wrapper], ol[data-node-type='decisionList'].${akEditorSelectedNodeClassName}.danger`]:
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
+  [dangerBackgroundStyles, dangerBorderStyles]
+});
+
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const decisionIconWithVisualRefresh = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors

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.0";
+export const version = "210.2.2";

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}"));
 };