@atlaskit/editor-core 207.19.6 → 207.21.0

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

@@ -12,6 +12,7 @@ import { ContextPanelWidthProvider } from '@atlaskit/editor-common/ui';
 import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
+import { getPrimaryToolbarComponents } from '../../Toolbar/getPrimaryToolbarComponents';
 import { FullPageContentArea } from './FullPageContentArea';
 import { FullPageToolbar } from './FullPageToolbar';
 import { getEditorViewMode } from './getEditorViewModeSync';
@@ -77,9 +78,10 @@ export const FullPageEditor = props => {
   const editorAPI = props.editorAPI;
   const {
     editorViewModeState,
-    primaryToolbarState,
+    primaryToolbarState: primaryToolbarHookState,
     interactionState
   } = useFullPageEditorPluginsStates(editorAPI);
+  const primaryToolbarState = getPrimaryToolbarComponents(editorAPI, primaryToolbarHookState === null || primaryToolbarHookState === void 0 ? void 0 : primaryToolbarHookState.components);
   const viewMode = getEditorViewMode(editorViewModeState, props.preset);
 
   // Remove all this logic when platform_editor_interaction_api_refactor is cleaned up
@@ -94,8 +96,18 @@ export const FullPageEditor = props => {
   } else {
     hasHadInteraction = interactionState === null || interactionState === void 0 ? void 0 : interactionState.hasHadInteraction;
   }
-  let toolbarDocking = useSharedPluginStateSelector(editorAPI, 'selectionToolbar.toolbarDocking');
-  if (!toolbarDocking && fg('platform_editor_controls_toolbar_ssr_fix')) {
+  let toolbarDocking = useSharedPluginStateSelector(editorAPI, 'selectionToolbar.toolbarDocking', {
+    disabled: fg('platform_editor_use_preferences_plugin')
+  });
+  let toolbarDockingPref = useSharedPluginStateSelector(editorAPI, 'userPreferences.preferences.toolbarDockingPosition', {
+    disabled: !fg('platform_editor_use_preferences_plugin')
+  });
+  if (fg('platform_editor_use_preferences_plugin')) {
+    if (!toolbarDockingPref) {
+      var _editorAPI$userPrefer, _editorAPI$userPrefer2;
+      toolbarDockingPref = editorAPI === null || editorAPI === void 0 ? void 0 : (_editorAPI$userPrefer = editorAPI.userPreferences) === null || _editorAPI$userPrefer === void 0 ? void 0 : (_editorAPI$userPrefer2 = _editorAPI$userPrefer.sharedState.currentState()) === null || _editorAPI$userPrefer2 === void 0 ? void 0 : _editorAPI$userPrefer2.preferences.toolbarDockingPosition;
+    }
+  } else if (!toolbarDocking && fg('platform_editor_controls_toolbar_ssr_fix')) {
     var _editorAPI$selectionT, _editorAPI$selectionT2, _editorAPI$selectionT3;
     // This is a workaround for the rendering issue with the selection toolbar
     // where using useSharedPluginStateSelector or useSharedPluginState the state are not
@@ -114,7 +126,15 @@ export const FullPageEditor = props => {
   if (editorExperiment('platform_editor_controls', 'variant1', {
     exposure: true
   })) {
-    if (fg('platform_editor_controls_toolbar_ssr_fix')) {
+    if (fg('platform_editor_use_preferences_plugin')) {
+      // need to check if the toolbarDockingPref is set to 'none' or 'top'
+      if (toolbarDockingPref === 'none') {
+        primaryToolbarComponents = [];
+        if (!hasCustomComponents(customPrimaryToolbarComponents)) {
+          isEditorToolbarHidden = true;
+        }
+      }
+    } else if (fg('platform_editor_controls_toolbar_ssr_fix')) {
       if (toolbarDocking === 'none') {
         primaryToolbarComponents = [];
         if (!hasCustomComponents(customPrimaryToolbarComponents)) {

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

@@ -17,7 +17,7 @@ import { EmojiSharedCssClassName, defaultEmojiHeight } from '@atlaskit/editor-co
 import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
 import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
 import { gapCursorStyles } from '@atlaskit/editor-common/selection';
-import { CodeBlockSharedCssClassName, MediaSharedClassNames, SmartCardSharedCssClassName, annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, embedCardStyles, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, linkSharedStyle, listsSharedStyles, paragraphSharedStyles, resizerStyles, pragmaticResizerStyles, pragmaticResizerStylesForTooltip, ruleSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
+import { CodeBlockSharedCssClassName, MediaSharedClassNames, SmartCardSharedCssClassName, annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, embedCardStyles, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, linkSharedStyle, listsSharedStyles, paragraphSharedStyles, resizerStyles, pragmaticResizerStyles, pragmaticStylesLayoutFirstNodeResizeHandleFix, pragmaticResizerStylesForTooltip, ruleSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
 import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
 import { findReplaceStyles } from '@atlaskit/editor-plugins/find-replace/styles';
 import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
@@ -443,6 +443,7 @@ const legacyContentStyles = props => css`
   ${unsupportedStyles}
   ${resizerStyles}
   ${pragmaticResizerStyles()}
+  ${pragmaticStylesLayoutFirstNodeResizeHandleFix()}
   ${pragmaticResizerStylesForTooltip()}
   ${aiPanelStyles(props.colorMode)}
   ${firstBlockNodeStylesNew}

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

@@ -45,7 +45,7 @@ import { mentionsStyles, vanillaMentionsStyles, vanillaMentionsSelectionStyles }
 import { panelStyles, panelStylesMixin_fg_platform_editor_add_border_for_nested_panel, panelStylesMixin_fg_platform_editor_lcm_nested_panel_icon_fix, panelStylesMixin_fg_platform_editor_nested_dnd_styles_changes, panelStylesMixin_without_fg_platform_editor_lcm_nested_panel_icon_fix, panelViewStyles } from './styles/panelStyles';
 import { paragraphStylesOld, paragraphStylesUGCModernized, paragraphStylesUGCRefreshed } from './styles/paragraphStyles';
 import { placeholderOverflowStyles, placeholderStyles, placeholderTextStyles, placeholderWrapStyles } from './styles/placeholderStyles';
-import { resizerStyles, pragmaticResizerStyles, pragmaticResizerStylesForTooltip } from './styles/resizerStyles';
+import { resizerStyles, pragmaticResizerStyles, pragmaticStylesLayoutFirstNodeResizeHandleFix, pragmaticResizerStylesForTooltip } from './styles/resizerStyles';
 import { ruleStyles } from './styles/rule';
 import { scrollbarStyles } from './styles/scrollbarStyles';
 import { hideCursorWhenHideSelectionStyles, hideSelectionStyles, selectedNodeStyles } from './styles/selectionStyles';
@@ -273,7 +273,9 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     browser.safari && listsStylesSafariFix, editorExperiment('platform_editor_breakout_resizing', true) &&
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-    pragmaticResizerStyles, editorExperiment('platform_editor_breakout_resizing', true) && fg('platform_editor_breakout_resizing_hello_release') &&
+    pragmaticResizerStyles, editorExperiment('advanced_layouts', true) && editorExperiment('platform_editor_breakout_resizing', true) && fg('platform_editor_breakout_resizing_hello_release') &&
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    pragmaticStylesLayoutFirstNodeResizeHandleFix, editorExperiment('platform_editor_breakout_resizing', true) && fg('platform_editor_breakout_resizing_hello_release') &&
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     pragmaticResizerStylesForTooltip,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values

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

@@ -232,6 +232,20 @@ export const pragmaticResizerStylesForTooltip = css({
   }
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const pragmaticStylesLayoutFirstNodeResizeHandleFix = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.fabric-editor-breakout-mark': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
+    '&:has([data-prosemirror-node-name="layoutSection"].first-node-in-document)': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '> .pm-breakout-resize-handle-container': {
+        height: 'calc(100% - 8px)'
+      }
+    }
+  }
+});
+
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const pragmaticResizerStyles = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors

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

@@ -26,6 +26,26 @@ const pulseOut = keyframes({
     opacity: 0
   }
 });
+const pulseInDuringTr = keyframes({
+  '0%, 95%': {
+    transform: 'scaleX(1)',
+    opacity: 1
+  },
+  '100%': {
+    transform: 'scaleX(0)',
+    opacity: 0
+  }
+});
+const pulseOutDuringTr = keyframes({
+  '100%': {
+    transform: 'scaleX(1)',
+    opacity: 1
+  },
+  '0%, 90%': {
+    transform: 'scaleX(0)',
+    opacity: 0
+  }
+});
 export const telepointerColorAndCommonStyle = css({
   '.ProseMirror .telepointer': {
     position: 'relative',
@@ -167,6 +187,14 @@ export const telepointerStyle = css({
         animation: `${pulseIn} 2s ease-in-out`
       }
     },
+    '&.telepointer-pulse-during-tr': {
+      '.telepointer-initial': {
+        animation: `${pulseOutDuringTr} 7500ms ease-in-out`
+      },
+      '.telepointer-fullname': {
+        animation: `${pulseInDuringTr} 7500ms ease-in-out`
+      }
+    },
     '&:hover': {
       '.telepointer-initial': {
         opacity: 0,

package/dist/es2019/ui/Toolbar/getPrimaryToolbarComponents.js

@@ -0,0 +1,16 @@
+import { fg } from '@atlaskit/platform-feature-flags';
+
+// Primary toolbar doesn't actually use plugin state so the state selector doesn't update as intended
+// We need a proper API to deal with non-prosemirror based state in plugins but until then we can retrieve
+// the latest
+export const getPrimaryToolbarComponents = (editorAPI, components) => {
+  if (fg('platform_editor_setup_editorapi_sync')) {
+    var _editorAPI$primaryToo, _editorAPI$primaryToo2;
+    return {
+      components: components !== null && components !== void 0 ? components : editorAPI === null || editorAPI === void 0 ? void 0 : (_editorAPI$primaryToo = editorAPI.primaryToolbar) === null || _editorAPI$primaryToo === void 0 ? void 0 : (_editorAPI$primaryToo2 = _editorAPI$primaryToo.sharedState.currentState()) === null || _editorAPI$primaryToo2 === void 0 ? void 0 : _editorAPI$primaryToo2.components
+    };
+  }
+  return {
+    components
+  };
+};

package/dist/es2019/version-wrapper.js

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

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

@@ -1,5 +1,6 @@
 import { useCallback, useEffect, useRef } from 'react';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, getAnalyticsEventsFromTransaction } from '@atlaskit/editor-common/analytics';
+import { isDirtyTransaction } from '@atlaskit/editor-common/collab';
 import { getDocStructure } from '@atlaskit/editor-common/core-utils';
 import { startMeasure, stopMeasure } from '@atlaskit/editor-common/performance-measures';
 import { findChangedNodesFromTransaction } from '../../utils/findChangedNodesFromTransaction';
@@ -51,9 +52,11 @@ export var useDispatchTransaction = function useDispatchTransaction(_ref) {
       });
       if (onChangeRef.current && transaction.docChanged) {
         var source = transaction.getMeta('isRemote') ? 'remote' : 'local';
+        var isDirtyChange = isDirtyTransaction(transaction);
         startMeasure(EVENT_NAME_ON_CHANGE);
         onChangeRef.current(view, {
-          source: source
+          source: source,
+          isDirtyChange: isDirtyChange
         });
         stopMeasure(EVENT_NAME_ON_CHANGE);
       }

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

@@ -107,7 +107,9 @@ export function ReactEditorView(props) {
     fireAnalyticsEvent: handleAnalyticsEvent
   }));
   useLayoutEffect(function () {
-    setEditorAPI(pluginInjectionAPI.current.api());
+    if (!fg('platform_editor_setup_editorapi_sync')) {
+      setEditorAPI(pluginInjectionAPI.current.api());
+    }
   }, []);
   var createEditorState = useCallback(function (options) {
     var _api$editorViewMode;
@@ -135,6 +137,9 @@ export function ReactEditorView(props) {
     } else {
       config.current = processPluginsList(createPluginsList(options.props.preset, props.editorProps, pluginInjectionAPI.current));
       schema = createSchema(config.current);
+      if (fg('platform_editor_setup_editorapi_sync')) {
+        setEditorAPI(pluginInjectionAPI.current.api());
+      }
     }
     var contentTransformerProvider = options.props.editorProps.contentTransformerProvider;
     var plugins = createPMPlugins({
@@ -243,7 +248,8 @@ export function ReactEditorView(props) {
     });
     viewRef.current.updateState(newEditorState);
     (_props$editorProps$on = (_props$editorProps2 = props.editorProps).onChange) === null || _props$editorProps$on === void 0 || _props$editorProps$on.call(_props$editorProps2, viewRef.current, {
-      source: 'local'
+      source: 'local',
+      isDirtyChange: false
     });
   }, [blur, createEditorState, props]);
 

package/dist/esm/i18n/sl.js

@@ -0,0 +1,13 @@
+/* prettier-ignore */
+/**
+ * NOTE:
+ *
+ * This file is automatically generated by Traduki 2.0.
+ * DO NOT CHANGE IT BY HAND or your changes will be lost.
+ */
+//Slovenian (Slovenia) [sl-SI]
+export default {
+  'fabric.editor.chromeCollapsedPlaceholder': 'Vnesite nekaj …',
+  'fabric.editor.editorAssistiveLabel': 'Glavno področje za vsebino; začnite tipkati, da vnesete besedilo.',
+  'fabric.editor.headingLink.toolbarHelpTitle': 'Odpri pogovorno okno pomoči'
+};

package/dist/esm/i18n/sr_RS.js

@@ -0,0 +1,13 @@
+/* prettier-ignore */
+/**
+ * NOTE:
+ *
+ * This file is automatically generated by Traduki 2.0.
+ * DO NOT CHANGE IT BY HAND or your changes will be lost.
+ */
+//Serbian (Serbia) [sr-RS]
+export default {
+  'fabric.editor.chromeCollapsedPlaceholder': 'Unesite tekst…',
+  'fabric.editor.editorAssistiveLabel': 'Glavna oblast za sadržaj, počnite da unosite tekst.',
+  'fabric.editor.headingLink.toolbarHelpTitle': 'Otvori dijalog pomoći'
+};

package/dist/esm/presets/default.js

@@ -4,6 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 // #region Imports
 
 import { EditorPresetBuilder } from '@atlaskit/editor-common/preset';
+import { userPreferencesPlugin } from '@atlaskit/editor-plugin-user-preferences';
 import { analyticsPlugin } from '@atlaskit/editor-plugins/analytics';
 import { basePlugin } from '@atlaskit/editor-plugins/base';
 import { betterTypeHistoryPlugin } from '@atlaskit/editor-plugins/better-type-history';
@@ -54,7 +55,13 @@ export function createDefaultPreset(options) {
     performanceTracking: options.performanceTracking
   }], Boolean(options.allowAnalyticsGASV3)).add(betterTypeHistoryPlugin).add([pastePlugin, _objectSpread(_objectSpread({}, options === null || options === void 0 ? void 0 : options.paste), {}, {
     isFullPage: isFullPage
-  })]).add(clipboardPlugin).add(focusPlugin).maybeAdd(interactionPlugin, Boolean(options === null || options === void 0 ? void 0 : options.__livePage) ? fg('platform_editor_no_cursor_on_live_doc_init') : expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true)).add(compositionPlugin).add([contextIdentifierPlugin, {
+  })]).add(clipboardPlugin).add(focusPlugin).maybeAdd([userPreferencesPlugin, {
+    initialUserPreferences: {
+      toolbarDockingPosition: isFullPage ? 'none' : 'top'
+    }
+  }], function () {
+    return fg('platform_editor_use_preferences_plugin');
+  }).maybeAdd(interactionPlugin, Boolean(options === null || options === void 0 ? void 0 : options.__livePage) ? fg('platform_editor_no_cursor_on_live_doc_init') : expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true)).add(compositionPlugin).add([contextIdentifierPlugin, {
     contextIdentifierProvider: options.contextIdentifierProvider
   }]).add([basePlugin, options.base]).add(decorationsPlugin).add([typeAheadPlugin, options.typeAhead]).maybeAdd(historyPlugin, Boolean(options.allowUndoRedoButtons)).add([primaryToolbarPlugin, {
     contextualFormattingEnabled: isFullPage

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

@@ -28,6 +28,7 @@ import { contentComponentClickWrapper } from '../../Addon/ClickAreaBlock/content
 import { createEditorContentStyle } from '../../ContentStyles';
 import EditorContentContainer from '../../EditorContentContainer/EditorContentContainer';
 import PluginSlot from '../../PluginSlot';
+import { getPrimaryToolbarComponents } from '../../Toolbar/getPrimaryToolbarComponents';
 import { ToolbarWithSizeDetector as Toolbar } from '../../Toolbar/ToolbarWithSizeDetector';
 import WithFlash from '../../WithFlash';
 import { MainToolbar, mainToolbarCustomComponentsSlotStyle } from './Toolbar';
@@ -105,8 +106,9 @@ export var CommentEditorWithIntl = function CommentEditorWithIntl(props) {
   var editorAPI = props.editorAPI;
   var _useCommentEditorPlug = useCommentEditorPluginsStates(editorAPI),
     maxContentSizeState = _useCommentEditorPlug.maxContentSizeState,
-    primaryToolbarState = _useCommentEditorPlug.primaryToolbarState,
+    primaryToolbarHookState = _useCommentEditorPlug.primaryToolbarState,
     editorViewModeState = _useCommentEditorPlug.editorViewModeState;
+  var primaryToolbarState = getPrimaryToolbarComponents(editorAPI, primaryToolbarHookState === null || primaryToolbarHookState === void 0 ? void 0 : primaryToolbarHookState.components);
   var _useSharedPluginState = useSharedPluginState(editorAPI, ['media']),
     mediaState = _useSharedPluginState.mediaState;
   var intl = useIntl();

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

@@ -13,6 +13,7 @@ import { ContextPanelWidthProvider } from '@atlaskit/editor-common/ui';
 import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
+import { getPrimaryToolbarComponents } from '../../Toolbar/getPrimaryToolbarComponents';
 import { FullPageContentArea } from './FullPageContentArea';
 import { FullPageToolbar } from './FullPageToolbar';
 import { getEditorViewMode } from './getEditorViewModeSync';
@@ -85,8 +86,9 @@ export var FullPageEditor = function FullPageEditor(props) {
   var editorAPI = props.editorAPI;
   var _useFullPageEditorPlu = useFullPageEditorPluginsStates(editorAPI),
     editorViewModeState = _useFullPageEditorPlu.editorViewModeState,
-    primaryToolbarState = _useFullPageEditorPlu.primaryToolbarState,
+    primaryToolbarHookState = _useFullPageEditorPlu.primaryToolbarState,
     interactionState = _useFullPageEditorPlu.interactionState;
+  var primaryToolbarState = getPrimaryToolbarComponents(editorAPI, primaryToolbarHookState === null || primaryToolbarHookState === void 0 ? void 0 : primaryToolbarHookState.components);
   var viewMode = getEditorViewMode(editorViewModeState, props.preset);
 
   // Remove all this logic when platform_editor_interaction_api_refactor is cleaned up
@@ -101,8 +103,18 @@ export var FullPageEditor = function FullPageEditor(props) {
   } else {
     hasHadInteraction = interactionState === null || interactionState === void 0 ? void 0 : interactionState.hasHadInteraction;
   }
-  var toolbarDocking = useSharedPluginStateSelector(editorAPI, 'selectionToolbar.toolbarDocking');
-  if (!toolbarDocking && fg('platform_editor_controls_toolbar_ssr_fix')) {
+  var toolbarDocking = useSharedPluginStateSelector(editorAPI, 'selectionToolbar.toolbarDocking', {
+    disabled: fg('platform_editor_use_preferences_plugin')
+  });
+  var toolbarDockingPref = useSharedPluginStateSelector(editorAPI, 'userPreferences.preferences.toolbarDockingPosition', {
+    disabled: !fg('platform_editor_use_preferences_plugin')
+  });
+  if (fg('platform_editor_use_preferences_plugin')) {
+    if (!toolbarDockingPref) {
+      var _editorAPI$userPrefer;
+      toolbarDockingPref = editorAPI === null || editorAPI === void 0 || (_editorAPI$userPrefer = editorAPI.userPreferences) === null || _editorAPI$userPrefer === void 0 || (_editorAPI$userPrefer = _editorAPI$userPrefer.sharedState.currentState()) === null || _editorAPI$userPrefer === void 0 ? void 0 : _editorAPI$userPrefer.preferences.toolbarDockingPosition;
+    }
+  } else if (!toolbarDocking && fg('platform_editor_controls_toolbar_ssr_fix')) {
     var _editorAPI$selectionT, _editorAPI$selectionT2;
     // This is a workaround for the rendering issue with the selection toolbar
     // where using useSharedPluginStateSelector or useSharedPluginState the state are not
@@ -119,7 +131,15 @@ export var FullPageEditor = function FullPageEditor(props) {
   if (editorExperiment('platform_editor_controls', 'variant1', {
     exposure: true
   })) {
-    if (fg('platform_editor_controls_toolbar_ssr_fix')) {
+    if (fg('platform_editor_use_preferences_plugin')) {
+      // need to check if the toolbarDockingPref is set to 'none' or 'top'
+      if (toolbarDockingPref === 'none') {
+        primaryToolbarComponents = [];
+        if (!hasCustomComponents(customPrimaryToolbarComponents)) {
+          isEditorToolbarHidden = true;
+        }
+      }
+    } else if (fg('platform_editor_controls_toolbar_ssr_fix')) {
       if (toolbarDocking === 'none') {
         primaryToolbarComponents = [];
         if (!hasCustomComponents(customPrimaryToolbarComponents)) {

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

@@ -19,7 +19,7 @@ import { EmojiSharedCssClassName, defaultEmojiHeight } from '@atlaskit/editor-co
 import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
 import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
 import { gapCursorStyles } from '@atlaskit/editor-common/selection';
-import { CodeBlockSharedCssClassName, MediaSharedClassNames, SmartCardSharedCssClassName, annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, embedCardStyles, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, linkSharedStyle, listsSharedStyles, paragraphSharedStyles, resizerStyles, pragmaticResizerStyles, pragmaticResizerStylesForTooltip, ruleSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
+import { CodeBlockSharedCssClassName, MediaSharedClassNames, SmartCardSharedCssClassName, annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, embedCardStyles, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, linkSharedStyle, listsSharedStyles, paragraphSharedStyles, resizerStyles, pragmaticResizerStyles, pragmaticStylesLayoutFirstNodeResizeHandleFix, pragmaticResizerStylesForTooltip, ruleSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
 import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
 import { findReplaceStyles } from '@atlaskit/editor-plugins/find-replace/styles';
 import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
@@ -145,7 +145,7 @@ var akEditorBreakpointForSmallDevice = "1266px";
 // Under editor experiment platform_editor_core_static_emotion
 // If you are making changes to this file, please make sure to update in EditorContentContainer.tsx as well
 var legacyContentStyles = function legacyContentStyles(props) {
-  return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n\t--ak-editor--default-gutter-padding: ", "px;\n\t/* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */\n\t--ak-editor--large-gutter-padding: ", "px;\n\t--ak-editor--default-layout-width: ", "px;\n\t--ak-editor--full-width-layout-width: ", "px;\n\t/* calculate editor line length, 100cqw is the editor container width */\n\t--ak-editor--line-length: min(\n\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\tvar(--ak-editor--default-layout-width)\n\t);\n\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t--ak-editor--breakout-full-page-guttering-padding: calc(\n\t\tvar(--ak-editor--large-gutter-padding) * 2 + var(--ak-editor--default-gutter-padding)\n\t);\n\n\t.fabric-editor--full-width-mode {\n\t\t--ak-editor--line-length: min(\n\t\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\t\tvar(--ak-editor--full-width-layout-width)\n\t\t);\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t/**\n\t * This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24\n\t *\n\t * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t *    https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\n\t", "\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px solid ", ";\n\t}\n\n\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\tcaret-color: transparent;\n\t}\n\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\tdisplay: none;\n\t}\n\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n\n  ", "\n\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", ";\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  /* Switch between the two icons based on the visual refresh feature gate */\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\n  .panelView-content-wrap {\n\t\tbox-sizing: border-box;\n\t}\n\n\t.mediaGroupView-content-wrap ul {\n\t\tpadding: 0;\n\t}\n\n\t/** Needed to override any cleared floats, e.g. image wrapping */\n\n\tdiv.fabric-editor-block-mark[class^='fabric-editor-align'] {\n\t\tclear: none !important;\n\t}\n\n\t.fabric-editor-align-end {\n\t\ttext-align: right;\n\t}\n\n\t.fabric-editor-align-start {\n\t\ttext-align: left;\n\t}\n\n\t.fabric-editor-align-center {\n\t\ttext-align: center;\n\t}\n\n\t/* For FullPage only when inside a table\n\tRelated code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\tIn the \"editorContentAreaContainerStyle\" function */\n\t.fabric-editor--full-width-mode {\n\t\t.pm-table-container {\n\t\t\t.code-block,\n\t\t\t.extension-container,\n\t\t\t.multiBodiedExtension--container {\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.pm-table-header-content-wrap :not(.fabric-editor-alignment),\n\t.pm-table-header-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark,\n\t.pm-table-cell-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark {\n\t\tp:first-of-type {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n\t.pm-table-cell-content-wrap .mediaGroupView-content-wrap {\n\t\tclear: both;\n\t}\n\n\t.hyperlink-floating-toolbar,\n\t.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n     is bigger than the others, new ADS icon does not have this issue\n  */\n\t", "\n"])), akEditorGutterPadding, akEditorGutterPaddingDynamic(), akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, akEditorCalculatedWideLayoutWidth, editorFontSize({
+  return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n\t--ak-editor--default-gutter-padding: ", "px;\n\t/* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */\n\t--ak-editor--large-gutter-padding: ", "px;\n\t--ak-editor--default-layout-width: ", "px;\n\t--ak-editor--full-width-layout-width: ", "px;\n\t/* calculate editor line length, 100cqw is the editor container width */\n\t--ak-editor--line-length: min(\n\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\tvar(--ak-editor--default-layout-width)\n\t);\n\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t--ak-editor--breakout-full-page-guttering-padding: calc(\n\t\tvar(--ak-editor--large-gutter-padding) * 2 + var(--ak-editor--default-gutter-padding)\n\t);\n\n\t.fabric-editor--full-width-mode {\n\t\t--ak-editor--line-length: min(\n\t\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\t\tvar(--ak-editor--full-width-layout-width)\n\t\t);\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t/**\n\t * This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24\n\t *\n\t * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t *    https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\n\t", "\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px solid ", ";\n\t}\n\n\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\tcaret-color: transparent;\n\t}\n\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\tdisplay: none;\n\t}\n\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n\n  ", "\n\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", ";\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  /* Switch between the two icons based on the visual refresh feature gate */\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\n  .panelView-content-wrap {\n\t\tbox-sizing: border-box;\n\t}\n\n\t.mediaGroupView-content-wrap ul {\n\t\tpadding: 0;\n\t}\n\n\t/** Needed to override any cleared floats, e.g. image wrapping */\n\n\tdiv.fabric-editor-block-mark[class^='fabric-editor-align'] {\n\t\tclear: none !important;\n\t}\n\n\t.fabric-editor-align-end {\n\t\ttext-align: right;\n\t}\n\n\t.fabric-editor-align-start {\n\t\ttext-align: left;\n\t}\n\n\t.fabric-editor-align-center {\n\t\ttext-align: center;\n\t}\n\n\t/* For FullPage only when inside a table\n\tRelated code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\tIn the \"editorContentAreaContainerStyle\" function */\n\t.fabric-editor--full-width-mode {\n\t\t.pm-table-container {\n\t\t\t.code-block,\n\t\t\t.extension-container,\n\t\t\t.multiBodiedExtension--container {\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.pm-table-header-content-wrap :not(.fabric-editor-alignment),\n\t.pm-table-header-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark,\n\t.pm-table-cell-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark {\n\t\tp:first-of-type {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n\t.pm-table-cell-content-wrap .mediaGroupView-content-wrap {\n\t\tclear: both;\n\t}\n\n\t.hyperlink-floating-toolbar,\n\t.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n     is bigger than the others, new ADS icon does not have this issue\n  */\n\t", "\n"])), akEditorGutterPadding, akEditorGutterPaddingDynamic(), akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, akEditorCalculatedWideLayoutWidth, editorFontSize({
     theme: props.theme
   }), whitespaceSharedStyles, paragraphSharedStyles(props.typographyTheme), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('platform_editor_hide_cursor_when_pm_hideselection') ? css(_templateObject0 || (_templateObject0 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, editorExperiment('platform_editor_advanced_code_blocks', true) ? css(_templateObject1 || (_templateObject1 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", fg('platform_editor_fix_floating_toolbar_focus') ? firstFloatingToolbarButtonStyles : null, placeholderTextStyles, placeholderStyles, editorExperiment('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, codeBlockStyles(), blocktypeStyles(props.typographyTheme), codeMarkSharedStyles(), textColorStyles, backgroundColorStyles(), listsStyles, ruleStyles(), mediaStyles(), layoutStyles(props.viewMode), fg('confluence_team_presence_scroll_to_pointer') ? telepointerStyle : telepointerStyleWithInitialOnly, gapCursorStyles, panelStyles(), mentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
     exposure: false
@@ -161,7 +161,7 @@ var legacyContentStyles = function legacyContentStyles(props) {
     exposure: false
   }) && fg('platform-visual-refresh-icons') && vanillaDecisionIconWithVisualRefresh, editorExperiment('platform_editor_vanilla_dom', true, {
     exposure: false
-  }) && !fg('platform-visual-refresh-icons') && vanillaDecisionIconWithoutVisualRefresh, statusStyles, editorExperiment('platform_editor_vanilla_dom', true) ? vanillaStatusStyles() : null, annotationSharedStyles(), smartCardStyles(), fg('platform-linking-visual-refresh-v1') ? getSmartCardSharedStyles() : smartCardSharedStyles, editorExperiment('platform_editor_vanilla_dom', true) ? dateVanillaStyles : null, dateStyles, embedCardStyles(), unsupportedStyles, resizerStyles, pragmaticResizerStyles(), pragmaticResizerStylesForTooltip(), aiPanelStyles(props.colorMode), firstBlockNodeStylesNew, MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT, !fg('platform-visual-refresh-icons') ? css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
+  }) && !fg('platform-visual-refresh-icons') && vanillaDecisionIconWithoutVisualRefresh, statusStyles, editorExperiment('platform_editor_vanilla_dom', true) ? vanillaStatusStyles() : null, annotationSharedStyles(), smartCardStyles(), fg('platform-linking-visual-refresh-v1') ? getSmartCardSharedStyles() : smartCardSharedStyles, editorExperiment('platform_editor_vanilla_dom', true) ? dateVanillaStyles : null, dateStyles, embedCardStyles(), unsupportedStyles, resizerStyles, pragmaticResizerStyles(), pragmaticStylesLayoutFirstNodeResizeHandleFix(), pragmaticResizerStylesForTooltip(), aiPanelStyles(props.colorMode), firstBlockNodeStylesNew, MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT, !fg('platform-visual-refresh-icons') ? css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
 };
 var listLayoutShiftFix = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors

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

@@ -45,7 +45,7 @@ import { mentionsStyles, vanillaMentionsStyles, vanillaMentionsSelectionStyles }
 import { panelStyles, panelStylesMixin_fg_platform_editor_add_border_for_nested_panel, panelStylesMixin_fg_platform_editor_lcm_nested_panel_icon_fix, panelStylesMixin_fg_platform_editor_nested_dnd_styles_changes, panelStylesMixin_without_fg_platform_editor_lcm_nested_panel_icon_fix, panelViewStyles } from './styles/panelStyles';
 import { paragraphStylesOld, paragraphStylesUGCModernized, paragraphStylesUGCRefreshed } from './styles/paragraphStyles';
 import { placeholderOverflowStyles, placeholderStyles, placeholderTextStyles, placeholderWrapStyles } from './styles/placeholderStyles';
-import { resizerStyles, pragmaticResizerStyles, pragmaticResizerStylesForTooltip } from './styles/resizerStyles';
+import { resizerStyles, pragmaticResizerStyles, pragmaticStylesLayoutFirstNodeResizeHandleFix, pragmaticResizerStylesForTooltip } from './styles/resizerStyles';
 import { ruleStyles } from './styles/rule';
 import { scrollbarStyles } from './styles/scrollbarStyles';
 import { hideCursorWhenHideSelectionStyles, hideSelectionStyles, selectedNodeStyles } from './styles/selectionStyles';
@@ -270,7 +270,9 @@ var EditorContentContainer = /*#__PURE__*/React.forwardRef(function (props, ref)
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     browser.safari && listsStylesSafariFix, editorExperiment('platform_editor_breakout_resizing', true) &&
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-    pragmaticResizerStyles, editorExperiment('platform_editor_breakout_resizing', true) && fg('platform_editor_breakout_resizing_hello_release') &&
+    pragmaticResizerStyles, editorExperiment('advanced_layouts', true) && editorExperiment('platform_editor_breakout_resizing', true) && fg('platform_editor_breakout_resizing_hello_release') &&
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    pragmaticStylesLayoutFirstNodeResizeHandleFix, editorExperiment('platform_editor_breakout_resizing', true) && fg('platform_editor_breakout_resizing_hello_release') &&
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     pragmaticResizerStylesForTooltip,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values

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

@@ -179,6 +179,20 @@ export var pragmaticResizerStylesForTooltip = css({
   }
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export var pragmaticStylesLayoutFirstNodeResizeHandleFix = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.fabric-editor-breakout-mark': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
+    '&:has([data-prosemirror-node-name="layoutSection"].first-node-in-document)': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '> .pm-breakout-resize-handle-container': {
+        height: 'calc(100% - 8px)'
+      }
+    }
+  }
+});
+
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export var pragmaticResizerStyles = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors

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

@@ -26,6 +26,26 @@ var pulseOut = keyframes({
     opacity: 0
   }
 });
+var pulseInDuringTr = keyframes({
+  '0%, 95%': {
+    transform: 'scaleX(1)',
+    opacity: 1
+  },
+  '100%': {
+    transform: 'scaleX(0)',
+    opacity: 0
+  }
+});
+var pulseOutDuringTr = keyframes({
+  '100%': {
+    transform: 'scaleX(1)',
+    opacity: 1
+  },
+  '0%, 90%': {
+    transform: 'scaleX(0)',
+    opacity: 0
+  }
+});
 export var telepointerColorAndCommonStyle = css({
   '.ProseMirror .telepointer': {
     position: 'relative',
@@ -167,6 +187,14 @@ export var telepointerStyle = css({
         animation: "".concat(pulseIn, " 2s ease-in-out")
       }
     },
+    '&.telepointer-pulse-during-tr': {
+      '.telepointer-initial': {
+        animation: "".concat(pulseOutDuringTr, " 7500ms ease-in-out")
+      },
+      '.telepointer-fullname': {
+        animation: "".concat(pulseInDuringTr, " 7500ms ease-in-out")
+      }
+    },
     '&:hover': {
       '.telepointer-initial': {
         opacity: 0,

package/dist/esm/ui/Toolbar/getPrimaryToolbarComponents.js

@@ -0,0 +1,16 @@
+import { fg } from '@atlaskit/platform-feature-flags';
+
+// Primary toolbar doesn't actually use plugin state so the state selector doesn't update as intended
+// We need a proper API to deal with non-prosemirror based state in plugins but until then we can retrieve
+// the latest
+export var getPrimaryToolbarComponents = function getPrimaryToolbarComponents(editorAPI, components) {
+  if (fg('platform_editor_setup_editorapi_sync')) {
+    var _editorAPI$primaryToo;
+    return {
+      components: components !== null && components !== void 0 ? components : editorAPI === null || editorAPI === void 0 || (_editorAPI$primaryToo = editorAPI.primaryToolbar) === null || _editorAPI$primaryToo === void 0 || (_editorAPI$primaryToo = _editorAPI$primaryToo.sharedState.currentState()) === null || _editorAPI$primaryToo === void 0 ? void 0 : _editorAPI$primaryToo.components
+    };
+  }
+  return {
+    components: components
+  };
+};

package/dist/esm/version-wrapper.js

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