@atlaskit/editor-core 209.1.8 → 209.1.10

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @atlaskit/editor-core
 
+## 209.1.10
+
+### Patch Changes
+
+- [#185723](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/185723)
+  [`751aeb4580469`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/751aeb4580469) -
+  ED-28315 clean up fg platform_editor_controls_patch_13
+- Updated dependencies
+
+## 209.1.9
+
+### Patch Changes
+
+- [#185940](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/185940)
+  [`456bee393c4d3`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/456bee393c4d3) -
+  [ux] When editor-area is less than 768px wide, we reduce editor gutters to 24px in Full-page
+  editor.
+- [#177925](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/177925)
+  [`4f971def5d8fd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4f971def5d8fd) -
+  [ux] ED-28293: clean up platform_editor_controls_toolbar_ssr_fix
+- Updated dependencies
+
 ## 209.1.8
 
 ### Patch Changes

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

@@ -112,7 +112,7 @@ var FullPageEditor = exports.FullPageEditor = function FullPageEditor(props) {
     }) || {},
     toolbarDockingPosition = _ref3.toolbarDockingPosition;
   if (!(0, _platformFeatureFlags.fg)('platform_editor_use_preferences_plugin')) {
-    if (!toolbarDocking && (0, _platformFeatureFlags.fg)('platform_editor_controls_toolbar_ssr_fix')) {
+    if (!toolbarDocking) {
       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
@@ -138,21 +138,13 @@ var FullPageEditor = exports.FullPageEditor = function FullPageEditor(props) {
           isEditorToolbarHidden = true;
         }
       }
-    } else if ((0, _platformFeatureFlags.fg)('platform_editor_controls_toolbar_ssr_fix')) {
+    } else {
       if (toolbarDocking === 'none') {
         primaryToolbarComponents = [];
         if (!hasCustomComponents(customPrimaryToolbarComponents)) {
           isEditorToolbarHidden = true;
         }
       }
-    } else {
-      var _primaryToolbarCompon;
-      if (toolbarDocking !== 'top') {
-        primaryToolbarComponents = [];
-      }
-      if (!((_primaryToolbarCompon = primaryToolbarComponents) !== null && _primaryToolbarCompon !== void 0 && _primaryToolbarCompon.length) && !hasCustomComponents(customPrimaryToolbarComponents)) {
-        isEditorToolbarHidden = true;
-      }
     }
   }
   var popupsBoundariesElement = props.popupsBoundariesElement || (scrollContentContainerRef === null || scrollContentContainerRef === void 0 || (_scrollContentContain = scrollContentContainerRef.current) === null || _scrollContentContain === void 0 ? void 0 : _scrollContentContain.containerArea) || undefined;

package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js

@@ -193,11 +193,22 @@ var contentAreaReducedHeaderSpace = (0, _react2.css)({
   paddingTop: "var(--ds-space-400, 32px)"
 });
 var editorContentGutterStyle = function editorContentGutterStyle() {
-  return (0, _react2.css)({
-    boxSizing: 'border-box',
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    padding: "0 ".concat((0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), "px")
-  });
+  if ((0, _expValEquals.expValEquals)('platform_editor_preview_panel_responsiveness', 'isEnabled', true)) {
+    return (0, _react2.css)((0, _defineProperty2.default)({
+      boxSizing: 'border-box',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      padding: "0 ".concat((0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), "px")
+    }, "@container editor-area (max-width: ".concat(_editorSharedStyles.akEditorFullPageNarrowBreakout, "px)"), {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      padding: "0 ".concat(_editorSharedStyles.akEditorGutterPaddingReduced, "px")
+    }));
+  } else {
+    return (0, _react2.css)({
+      boxSizing: 'border-box',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      padding: "0 ".concat((0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), "px")
+    });
+  }
 };
 
 // new styles
@@ -296,6 +307,10 @@ var editorContentGutterStyles = (0, _react2.css)({
   boxSizing: 'border-box',
   padding: '0 52px'
 });
+var editorContentReducedGutterStyles = (0, _react2.css)((0, _defineProperty2.default)({}, "@container editor-area (max-width: ".concat(_editorSharedStyles.akEditorFullPageNarrowBreakout, "px)"), {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  padding: "0 ".concat(_editorSharedStyles.akEditorGutterPaddingReduced, "px")
+}));
 var contentAreaNew = (0, _react2.css)({
   display: 'flex',
   flexDirection: 'row',
@@ -414,7 +429,7 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   }, (0, _react2.jsx)("div", {
     css: (0, _expValEquals.expValEquals)('platform_editor_core_static_emotion_non_central', 'isEnabled', true) ? [editorContentGutterStyles,
     // eslint-disable-next-line @atlaskit/platform/no-preconditioning
-    (0, _platformFeatureFlags.fg)('platform_editor_controls_increase_full_page_gutter') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && editorContentGutterStyleFG] : [
+    (0, _platformFeatureFlags.fg)('platform_editor_controls_increase_full_page_gutter') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && editorContentGutterStyleFG, (0, _expValEquals.expValEquals)('platform_editor_preview_panel_responsiveness', 'isEnabled', true) && editorContentReducedGutterStyles] : [
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     editorContentGutterStyle()]
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766

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

@@ -37,7 +37,7 @@ var _media = require("./media");
 var _panel2 = require("./panel");
 var _status = require("./status");
 var _tasksAndDecisions = require("./tasks-and-decisions");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11;
 /* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
 /* eslint-disable react-hooks/rules-of-hooks */
 /* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- Requires manual remediation over time due to use of unsafe nested mixins */
@@ -168,9 +168,9 @@ 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 (0, _react2.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\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--ak-editor--breakout-fallback-width: calc(\n\t\t100cqw - var(--ak-editor--breakout-full-page-guttering-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\n\t\t/* in full width appearances it's not possible to rely on cqw because it doesn't account for the page scrollbar, which depends on users system settings */\n\t\t--ak-editor--breakout-fallback-width: 100%;\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\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\t", "\n  /* Switch between the two icons based on the visual refresh feature gate */\n\t", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\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"])), _editorSharedStyles.akEditorGutterPadding, (0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), _editorSharedStyles.akEditorDefaultLayoutWidth, _editorSharedStyles.akEditorFullWidthLayoutWidth, _editorSharedStyles.akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, _editorSharedStyles.akEditorCalculatedWideLayoutWidth, (0, _editorSharedStyles.editorFontSize)({
+  return (0, _react2.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\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--ak-editor--breakout-fallback-width: calc(\n\t\t100cqw - var(--ak-editor--breakout-full-page-guttering-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\n\t\t/* in full width appearances it's not possible to rely on cqw because it doesn't account for the page scrollbar, which depends on users system settings */\n\t\t--ak-editor--breakout-fallback-width: 100%;\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", "\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\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\t", "\n  /* Switch between the two icons based on the visual refresh feature gate */\n\t", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\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"])), _editorSharedStyles.akEditorGutterPadding, (0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), _editorSharedStyles.akEditorDefaultLayoutWidth, _editorSharedStyles.akEditorFullWidthLayoutWidth, _editorSharedStyles.akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, _editorSharedStyles.akEditorCalculatedWideLayoutWidth, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? (0, _react2.css)(_templateObject0 || (_templateObject0 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t\t\t\t@container editor-area (max-width: ", "px) {\n\t\t\t\t\t--ak-editor--large-gutter-padding: ", "px;\n\t\t\t\t}\n\t\t\t"])), _editorSharedStyles.akEditorFullPageNarrowBreakout, _editorSharedStyles.akEditorGutterPaddingReduced) : null, (0, _editorSharedStyles.editorFontSize)({
     theme: props.theme
-  }), _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(props.typographyTheme), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('platform_editor_hide_cursor_when_pm_hideselection') ? (0, _react2.css)(_templateObject0 || (_templateObject0 = (0, _taggedTemplateLiteral2.default)(["\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, (0, _experiments.editorExperiment)('platform_editor_advanced_code_blocks', true) ? (0, _react2.css)(_templateObject1 || (_templateObject1 = (0, _taggedTemplateLiteral2.default)(["\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)", firstFloatingToolbarButtonStyles, _styles5.placeholderTextStyles, (0, _platformFeatureFlags.fg)('platform_editor_system_fake_text_highlight_colour') && _styles5.placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour, placeholderStyles, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, (0, _codeBlock.codeBlockStyles)(), (0, _styles2.blocktypeStyles)(props.typographyTheme), (0, _styles.codeMarkSharedStyles)(), _styles.textColorStyles, (0, _styles.backgroundColorStyles)(), listsStyles, ruleStyles(), (0, _media.mediaStyles)(), (0, _layout.layoutStyles)(props.viewMode), (0, _platformFeatureFlags.fg)('confluence_team_presence_scroll_to_pointer') ? _collab.telepointerStyle : _collab.telepointerStyleWithInitialOnly, _selection.gapCursorStyles, (0, _panel2.panelStyles)(), mentionsStyles, mentionNodeStyles, (0, _platformFeatureFlags.fg)('platform_editor_centre_mention_padding') && mentionNodeStylesMixin_fg_platform_editor_centre_mention_padding, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_find_and_replace_improvements_1') ? mentionsSelectionStylesWithSearchMatch : mentionSelectionStyles, emojiStyles, _styles.tasksAndDecisionsStyles, _styles.gridStyles, linkStyles, _styles.blockMarksSharedStyles, _styles.dateSharedStyle, _extension.extensionStyles, (0, _expand.expandStyles)(), (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? (0, _platformFeatureFlags.fg)('platform_editor_find_and_replace_improvements_1') ? _styles3.findReplaceStylesNewNoImportant : _styles3.findReplaceStylesNew : _styles3.findReplaceStyles, _styles4.textHighlightStyle, _tasksAndDecisions.taskDecisionStyles, _tasksAndDecisions.taskItemStyles, (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.taskDecisionIconWithVisualRefresh, !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.taskDecisionIconWithoutVisualRefresh, (0, _status.statusStyles)(), (0, _status.statusNodeStyles)(), (0, _styles.annotationSharedStyles)(), (0, _styles.smartCardStyles)(), (0, _styles.getSmartCardSharedStyles)(), _date.dateStyles, _date.dateNodeStyles, (0, _styles.embedCardStyles)(), _styles.unsupportedStyles, _styles.resizerStyles, (0, _styles.pragmaticResizerStyles)(), (0, _styles.pragmaticStylesLayoutFirstNodeResizeHandleFix)(), (0, _styles.pragmaticResizerStylesForTooltip)(), (0, _aiPanels.aiPanelStyles)(props.colorMode), firstBlockNodeStylesNew, (0, _platformFeatureFlags.fg)('platform_editor_vanilla_codebidi_warning') && _codeBidiWarning.codeBidiWarningStyles, _styles.MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT, !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ? (0, _react2.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\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);
+  }), _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(props.typographyTheme), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('platform_editor_hide_cursor_when_pm_hideselection') ? (0, _react2.css)(_templateObject1 || (_templateObject1 = (0, _taggedTemplateLiteral2.default)(["\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, (0, _experiments.editorExperiment)('platform_editor_advanced_code_blocks', true) ? (0, _react2.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\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)", firstFloatingToolbarButtonStyles, _styles5.placeholderTextStyles, (0, _platformFeatureFlags.fg)('platform_editor_system_fake_text_highlight_colour') && _styles5.placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour, placeholderStyles, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, (0, _codeBlock.codeBlockStyles)(), (0, _styles2.blocktypeStyles)(props.typographyTheme), (0, _styles.codeMarkSharedStyles)(), _styles.textColorStyles, (0, _styles.backgroundColorStyles)(), listsStyles, ruleStyles(), (0, _media.mediaStyles)(), (0, _layout.layoutStyles)(props.viewMode), (0, _platformFeatureFlags.fg)('confluence_team_presence_scroll_to_pointer') ? _collab.telepointerStyle : _collab.telepointerStyleWithInitialOnly, _selection.gapCursorStyles, (0, _panel2.panelStyles)(), mentionsStyles, mentionNodeStyles, (0, _platformFeatureFlags.fg)('platform_editor_centre_mention_padding') && mentionNodeStylesMixin_fg_platform_editor_centre_mention_padding, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_find_and_replace_improvements_1') ? mentionsSelectionStylesWithSearchMatch : mentionSelectionStyles, emojiStyles, _styles.tasksAndDecisionsStyles, _styles.gridStyles, linkStyles, _styles.blockMarksSharedStyles, _styles.dateSharedStyle, _extension.extensionStyles, (0, _expand.expandStyles)(), (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? (0, _platformFeatureFlags.fg)('platform_editor_find_and_replace_improvements_1') ? _styles3.findReplaceStylesNewNoImportant : _styles3.findReplaceStylesNew : _styles3.findReplaceStyles, _styles4.textHighlightStyle, _tasksAndDecisions.taskDecisionStyles, _tasksAndDecisions.taskItemStyles, (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.taskDecisionIconWithVisualRefresh, !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') && _tasksAndDecisions.taskDecisionIconWithoutVisualRefresh, (0, _status.statusStyles)(), (0, _status.statusNodeStyles)(), (0, _styles.annotationSharedStyles)(), (0, _styles.smartCardStyles)(), (0, _styles.getSmartCardSharedStyles)(), _date.dateStyles, _date.dateNodeStyles, (0, _styles.embedCardStyles)(), _styles.unsupportedStyles, _styles.resizerStyles, (0, _styles.pragmaticResizerStyles)(), (0, _styles.pragmaticStylesLayoutFirstNodeResizeHandleFix)(), (0, _styles.pragmaticResizerStylesForTooltip)(), (0, _aiPanels.aiPanelStyles)(props.colorMode), firstBlockNodeStylesNew, (0, _platformFeatureFlags.fg)('platform_editor_vanilla_codebidi_warning') && _codeBidiWarning.codeBidiWarningStyles, _styles.MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT, !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ? (0, _react2.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\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 createEditorContentStyle = exports.createEditorContentStyle = function createEditorContentStyle(styles) {
   return /*#__PURE__*/_react.default.forwardRef(function (props, ref) {

package/dist/cjs/ui/EditorContentContainer/EditorContentContainer.js

@@ -90,6 +90,19 @@ var EditorContentContainer = /*#__PURE__*/_react.default.forwardRef(function (pr
     colorMode = _useThemeObserver.colorMode;
   var isFullPage = appearance === 'full-page' || appearance === 'full-width';
   var isComment = appearance === 'comment';
+  var style = (0, _expValEquals.expValEquals)('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    '--ak-editor-base-font-size': "".concat((0, _editorSharedStyles.editorFontSize)({
+      theme: theme
+    }), "px")
+  } : {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    '--ak-editor-base-font-size': "".concat((0, _editorSharedStyles.editorFontSize)({
+      theme: theme
+    }), "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    '--ak-editor--large-gutter-padding': "".concat((0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), "px")
+  };
   return (0, _react2.jsx)("div", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     className: className,
@@ -97,6 +110,14 @@ var EditorContentContainer = /*#__PURE__*/_react.default.forwardRef(function (pr
     css: [
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     _baseStyles.baseStyles,
+    // eslint-disable-next-line @atlaskit/platform/no-preconditioning
+    (0, _platformFeatureFlags.fg)('platform_editor_controls_increase_full_page_gutter') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ?
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    _baseStyles.editorLargeGutterPuddingBaseStylesEditorControls :
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    _baseStyles.editorLargeGutterPuddingBaseStyles, (0, _expValEquals.expValEquals)('platform_editor_preview_panel_responsiveness', 'isEnabled', true) &&
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    _baseStyles.editorLargeGutterPuddingReducedBaseStyles,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     _whitespaceStyles.whitespaceStyles,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -342,15 +363,10 @@ var EditorContentContainer = /*#__PURE__*/_react.default.forwardRef(function (pr
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     (0, _platformFeatureFlags.fg)('platform_editor_vanilla_codebidi_warning') && _codeBidiWarningStyles.codeBidiWarningStyles],
     "data-editor-scroll-container": isScrollable ? 'true' : undefined,
-    "data-testid": "editor-content-container",
-    style: {
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-      '--ak-editor-base-font-size': "".concat((0, _editorSharedStyles.editorFontSize)({
-        theme: theme
-      }), "px"),
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-      '--ak-editor--large-gutter-padding': "".concat((0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), "px")
-    }
+    "data-testid": "editor-content-container"
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
+    ,
+    style: style
   }, children);
 });
 var _default = exports.default = EditorContentContainer;

package/dist/cjs/ui/EditorContentContainer/styles/baseStyles.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.baseStyles = void 0;
+exports.editorLargeGutterPuddingReducedBaseStyles = exports.editorLargeGutterPuddingBaseStylesEditorControls = exports.editorLargeGutterPuddingBaseStyles = exports.baseStyles = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("@emotion/react");
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
@@ -18,6 +18,8 @@ var akEditorDefaultLayoutWidth = 760;
 var akEditorFullWidthLayoutWidth = 1800;
 // The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
 var akEditorBreakpointForSmallDevice = "1266px";
+var akEditorGutterPaddingReduced = 24;
+var akEditorFullPageNarrowBreakout = 768;
 
 // jest warning: JSDOM version (22) doesn't support the new @container CSS rule
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
@@ -53,4 +55,21 @@ var baseStyles = exports.baseStyles = (0, _react.css)((0, _defineProperty2.defau
   '.ProseMirror': {
     '--ak-editor--breakout-wide-layout-width': "".concat(akEditorCalculatedWideLayoutWidth, "px")
   }
+}));
+
+// This is to avoid using akEditorGutterPaddingDynamic()
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var editorLargeGutterPuddingBaseStyles = exports.editorLargeGutterPuddingBaseStyles = (0, _react.css)({
+  '--ak-editor--large-gutter-padding': '52px'
+});
+
+// This is to avoid using akEditorGutterPaddingDynamic
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var editorLargeGutterPuddingBaseStylesEditorControls = exports.editorLargeGutterPuddingBaseStylesEditorControls = (0, _react.css)({
+  '--ak-editor--large-gutter-padding': '72px'
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var editorLargeGutterPuddingReducedBaseStyles = exports.editorLargeGutterPuddingReducedBaseStyles = (0, _react.css)((0, _defineProperty2.default)({}, "@container editor-area (max-width: ".concat(akEditorFullPageNarrowBreakout, "px)"), {
+  '--ak-editor--large-gutter-padding': "".concat(akEditorGutterPaddingReduced, "px")
 }));

package/dist/cjs/ui/EditorContentContainer/styles/selectionToolbarStyles.js

@@ -10,7 +10,7 @@ var _react = require("@emotion/react");
 var fadeIn = (0, _react.keyframes)({
   from: {
     opacity: 0,
-    transform: 'translateY(-16px)'
+    transform: 'translateY(16px)'
   },
   to: {
     opacity: 1,

package/dist/cjs/version-wrapper.js

@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.version = exports.name = void 0;
 var name = exports.name = "@atlaskit/editor-core";
-var version = exports.version = "209.1.7";
+var version = exports.version = "209.1.10";

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

@@ -96,7 +96,7 @@ export const FullPageEditor = props => {
     disabled: !fg('platform_editor_use_preferences_plugin')
   }) || {};
   if (!fg('platform_editor_use_preferences_plugin')) {
-    if (!toolbarDocking && fg('platform_editor_controls_toolbar_ssr_fix')) {
+    if (!toolbarDocking) {
       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
@@ -124,21 +124,13 @@ export const FullPageEditor = props => {
           isEditorToolbarHidden = true;
         }
       }
-    } else if (fg('platform_editor_controls_toolbar_ssr_fix')) {
+    } else {
       if (toolbarDocking === 'none') {
         primaryToolbarComponents = [];
         if (!hasCustomComponents(customPrimaryToolbarComponents)) {
           isEditorToolbarHidden = true;
         }
       }
-    } else {
-      var _primaryToolbarCompon;
-      if (toolbarDocking !== 'top') {
-        primaryToolbarComponents = [];
-      }
-      if (!((_primaryToolbarCompon = primaryToolbarComponents) !== null && _primaryToolbarCompon !== void 0 && _primaryToolbarCompon.length) && !hasCustomComponents(customPrimaryToolbarComponents)) {
-        isEditorToolbarHidden = true;
-      }
     }
   }
   const popupsBoundariesElement = props.popupsBoundariesElement || (scrollContentContainerRef === null || scrollContentContainerRef === void 0 ? void 0 : (_scrollContentContain = scrollContentContainerRef.current) === null || _scrollContentContain === void 0 ? void 0 : _scrollContentContain.containerArea) || undefined;

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

@@ -12,7 +12,7 @@ import { injectIntl } from 'react-intl-next';
 import { decisionListSelector, taskListSelector } from '@atlaskit/adf-schema';
 import { fullPageMessages as messages } from '@atlaskit/editor-common/messages';
 import { tableFullPageEditorStyles } from '@atlaskit/editor-plugins/table/ui/common-styles';
-import { FULL_PAGE_EDITOR_TOOLBAR_HEIGHT, akEditorGutterPaddingDynamic } from '@atlaskit/editor-shared-styles';
+import { FULL_PAGE_EDITOR_TOOLBAR_HEIGHT, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
 import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
@@ -176,11 +176,24 @@ const contentAreaReducedHeaderSpace = css({
   paddingTop: "var(--ds-space-400, 32px)"
 });
 const editorContentGutterStyle = () => {
-  return css({
-    boxSizing: 'border-box',
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    padding: `0 ${akEditorGutterPaddingDynamic()}px`
-  });
+  if (expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true)) {
+    return css({
+      boxSizing: 'border-box',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      padding: `0 ${akEditorGutterPaddingDynamic()}px`,
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-container-queries, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
+      [`@container editor-area (max-width: ${akEditorFullPageNarrowBreakout}px)`]: {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        padding: `0 ${akEditorGutterPaddingReduced}px`
+      }
+    });
+  } else {
+    return css({
+      boxSizing: 'border-box',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      padding: `0 ${akEditorGutterPaddingDynamic()}px`
+    });
+  }
 };
 
 // new styles
@@ -279,6 +292,13 @@ const editorContentGutterStyles = css({
   boxSizing: 'border-box',
   padding: '0 52px'
 });
+const editorContentReducedGutterStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-container-queries, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
+  [`@container editor-area (max-width: ${akEditorFullPageNarrowBreakout}px)`]: {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+    padding: `0 ${akEditorGutterPaddingReduced}px`
+  }
+});
 const contentAreaNew = css({
   display: 'flex',
   flexDirection: 'row',
@@ -395,7 +415,7 @@ const Content = /*#__PURE__*/React.forwardRef((props, ref) => {
   }, jsx("div", {
     css: expValEquals('platform_editor_core_static_emotion_non_central', 'isEnabled', true) ? [editorContentGutterStyles,
     // eslint-disable-next-line @atlaskit/platform/no-preconditioning
-    fg('platform_editor_controls_increase_full_page_gutter') && editorExperiment('platform_editor_controls', 'variant1') && editorContentGutterStyleFG] : [
+    fg('platform_editor_controls_increase_full_page_gutter') && editorExperiment('platform_editor_controls', 'variant1') && editorContentGutterStyleFG, expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) && editorContentReducedGutterStyles] : [
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     editorContentGutterStyle()]
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766

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

@@ -22,7 +22,7 @@ import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
 import { findReplaceStyles, findReplaceStylesNew, findReplaceStylesNewNoImportant } from '@atlaskit/editor-plugins/find-replace/styles';
 import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
 import { placeholderTextStyles, placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour } from '@atlaskit/editor-plugins/placeholder-text/styles';
-import { SelectionStyle, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorGutterPaddingDynamic, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles } from '@atlaskit/editor-shared-styles';
+import { SelectionStyle, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles } from '@atlaskit/editor-shared-styles';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
@@ -353,6 +353,13 @@ const legacyContentStyles = props => css`
 		}
 	}
 
+	${expValEqualsNoExposure('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? css`
+				/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */
+				@container editor-area (max-width: ${akEditorFullPageNarrowBreakout}px) {
+					--ak-editor--large-gutter-padding: ${akEditorGutterPaddingReduced}px;
+				}
+			` : null}
+
 	.ProseMirror {
 		outline: none;
 		font-size: ${editorFontSize({

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

@@ -18,7 +18,7 @@ import { useThemeObserver } from '@atlaskit/tokens';
 import { aiPanelBaseFirefoxStyles, aiPanelBaseStyles, aiPanelDarkFirefoxStyles, aiPanelDarkStyles } from './styles/aiPanel';
 import { annotationStyles } from './styles/annotationStyles';
 import { backgroundColorStyles } from './styles/backgroundColorStyles';
-import { baseStyles } from './styles/baseStyles';
+import { baseStyles, editorLargeGutterPuddingBaseStyles, editorLargeGutterPuddingBaseStylesEditorControls, editorLargeGutterPuddingReducedBaseStyles } from './styles/baseStyles';
 import { blockMarksStyles } from './styles/blockMarksStyles';
 import { blocktypeStyles, blocktypeStyles_fg_platform_editor_nested_dnd_styles_changes, blocktypeStyles_fg_platform_editor_typography_ugc, blocktypeStyles_without_fg_platform_editor_typography_ugc } from './styles/blockTypeStyles';
 import { codeBidiWarningStyles } from './styles/codeBidiWarningStyles';
@@ -85,6 +85,19 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
   } = useThemeObserver();
   const isFullPage = appearance === 'full-page' || appearance === 'full-width';
   const isComment = appearance === 'comment';
+  const style = expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    '--ak-editor-base-font-size': `${editorFontSize({
+      theme
+    })}px`
+  } : {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    '--ak-editor-base-font-size': `${editorFontSize({
+      theme
+    })}px`,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    '--ak-editor--large-gutter-padding': `${akEditorGutterPaddingDynamic()}px`
+  };
   return jsx("div", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     className: className,
@@ -92,6 +105,14 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
     css: [
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     baseStyles,
+    // eslint-disable-next-line @atlaskit/platform/no-preconditioning
+    fg('platform_editor_controls_increase_full_page_gutter') && editorExperiment('platform_editor_controls', 'variant1') ?
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    editorLargeGutterPuddingBaseStylesEditorControls :
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    editorLargeGutterPuddingBaseStyles, expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) &&
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    editorLargeGutterPuddingReducedBaseStyles,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     whitespaceStyles,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -337,15 +358,10 @@ const EditorContentContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     fg('platform_editor_vanilla_codebidi_warning') && codeBidiWarningStyles],
     "data-editor-scroll-container": isScrollable ? 'true' : undefined,
-    "data-testid": "editor-content-container",
-    style: {
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-      '--ak-editor-base-font-size': `${editorFontSize({
-        theme
-      })}px`,
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-      '--ak-editor--large-gutter-padding': `${akEditorGutterPaddingDynamic()}px`
-    }
+    "data-testid": "editor-content-container"
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
+    ,
+    style: style
   }, children);
 });
 export default EditorContentContainer;

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

@@ -10,6 +10,8 @@ const akEditorDefaultLayoutWidth = 760;
 const akEditorFullWidthLayoutWidth = 1800;
 // The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
 const akEditorBreakpointForSmallDevice = `1266px`;
+const akEditorGutterPaddingReduced = 24;
+const akEditorFullPageNarrowBreakout = 768;
 
 // jest warning: JSDOM version (22) doesn't support the new @container CSS rule
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
@@ -48,4 +50,24 @@ export const baseStyles = css({
       '--ak-editor--breakout-wide-layout-width': `${akEditorCalculatedWideLayoutWidth}px`
     }
   }
+});
+
+// This is to avoid using akEditorGutterPaddingDynamic()
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const editorLargeGutterPuddingBaseStyles = css({
+  '--ak-editor--large-gutter-padding': '52px'
+});
+
+// This is to avoid using akEditorGutterPaddingDynamic
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const editorLargeGutterPuddingBaseStylesEditorControls = css({
+  '--ak-editor--large-gutter-padding': '72px'
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export const editorLargeGutterPuddingReducedBaseStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-container-queries, @atlaskit/ui-styling-standard/no-unsafe-values
+  [`@container editor-area (max-width: ${akEditorFullPageNarrowBreakout}px)`]: {
+    '--ak-editor--large-gutter-padding': `${akEditorGutterPaddingReduced}px`
+  }
 });

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

@@ -3,7 +3,7 @@ import { css, keyframes } from '@emotion/react'; // eslint-disable-line @atlaski
 const fadeIn = keyframes({
   from: {
     opacity: 0,
-    transform: 'translateY(-16px)'
+    transform: 'translateY(16px)'
   },
   to: {
     opacity: 1,

package/dist/es2019/version-wrapper.js

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

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

@@ -102,7 +102,7 @@ export var FullPageEditor = function FullPageEditor(props) {
     }) || {},
     toolbarDockingPosition = _ref3.toolbarDockingPosition;
   if (!fg('platform_editor_use_preferences_plugin')) {
-    if (!toolbarDocking && fg('platform_editor_controls_toolbar_ssr_fix')) {
+    if (!toolbarDocking) {
       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
@@ -128,21 +128,13 @@ export var FullPageEditor = function FullPageEditor(props) {
           isEditorToolbarHidden = true;
         }
       }
-    } else if (fg('platform_editor_controls_toolbar_ssr_fix')) {
+    } else {
       if (toolbarDocking === 'none') {
         primaryToolbarComponents = [];
         if (!hasCustomComponents(customPrimaryToolbarComponents)) {
           isEditorToolbarHidden = true;
         }
       }
-    } else {
-      var _primaryToolbarCompon;
-      if (toolbarDocking !== 'top') {
-        primaryToolbarComponents = [];
-      }
-      if (!((_primaryToolbarCompon = primaryToolbarComponents) !== null && _primaryToolbarCompon !== void 0 && _primaryToolbarCompon.length) && !hasCustomComponents(customPrimaryToolbarComponents)) {
-        isEditorToolbarHidden = true;
-      }
     }
   }
   var popupsBoundariesElement = props.popupsBoundariesElement || (scrollContentContainerRef === null || scrollContentContainerRef === void 0 || (_scrollContentContain = scrollContentContainerRef.current) === null || _scrollContentContain === void 0 ? void 0 : _scrollContentContain.containerArea) || undefined;

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

@@ -14,7 +14,7 @@ import { injectIntl } from 'react-intl-next';
 import { decisionListSelector, taskListSelector } from '@atlaskit/adf-schema';
 import { fullPageMessages as messages } from '@atlaskit/editor-common/messages';
 import { tableFullPageEditorStyles } from '@atlaskit/editor-plugins/table/ui/common-styles';
-import { FULL_PAGE_EDITOR_TOOLBAR_HEIGHT, akEditorGutterPaddingDynamic } from '@atlaskit/editor-shared-styles';
+import { FULL_PAGE_EDITOR_TOOLBAR_HEIGHT, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
 import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
@@ -183,11 +183,22 @@ var contentAreaReducedHeaderSpace = css({
   paddingTop: "var(--ds-space-400, 32px)"
 });
 var editorContentGutterStyle = function editorContentGutterStyle() {
-  return css({
-    boxSizing: 'border-box',
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    padding: "0 ".concat(akEditorGutterPaddingDynamic(), "px")
-  });
+  if (expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true)) {
+    return css(_defineProperty({
+      boxSizing: 'border-box',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      padding: "0 ".concat(akEditorGutterPaddingDynamic(), "px")
+    }, "@container editor-area (max-width: ".concat(akEditorFullPageNarrowBreakout, "px)"), {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      padding: "0 ".concat(akEditorGutterPaddingReduced, "px")
+    }));
+  } else {
+    return css({
+      boxSizing: 'border-box',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      padding: "0 ".concat(akEditorGutterPaddingDynamic(), "px")
+    });
+  }
 };
 
 // new styles
@@ -286,6 +297,10 @@ var editorContentGutterStyles = css({
   boxSizing: 'border-box',
   padding: '0 52px'
 });
+var editorContentReducedGutterStyles = css(_defineProperty({}, "@container editor-area (max-width: ".concat(akEditorFullPageNarrowBreakout, "px)"), {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  padding: "0 ".concat(akEditorGutterPaddingReduced, "px")
+}));
 var contentAreaNew = css({
   display: 'flex',
   flexDirection: 'row',
@@ -404,7 +419,7 @@ var Content = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, jsx("div", {
     css: expValEquals('platform_editor_core_static_emotion_non_central', 'isEnabled', true) ? [editorContentGutterStyles,
     // eslint-disable-next-line @atlaskit/platform/no-preconditioning
-    fg('platform_editor_controls_increase_full_page_gutter') && editorExperiment('platform_editor_controls', 'variant1') && editorContentGutterStyleFG] : [
+    fg('platform_editor_controls_increase_full_page_gutter') && editorExperiment('platform_editor_controls', 'variant1') && editorContentGutterStyleFG, expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) && editorContentReducedGutterStyles] : [
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     editorContentGutterStyle()]
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766

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

@@ -1,5 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11;
 /* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
 /* eslint-disable react-hooks/rules-of-hooks */
 /* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- Requires manual remediation over time due to use of unsafe nested mixins */
@@ -24,7 +24,7 @@ import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
 import { findReplaceStyles, findReplaceStylesNew, findReplaceStylesNewNoImportant } from '@atlaskit/editor-plugins/find-replace/styles';
 import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
 import { placeholderTextStyles, placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour } from '@atlaskit/editor-plugins/placeholder-text/styles';
-import { SelectionStyle, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorGutterPaddingDynamic, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles } from '@atlaskit/editor-shared-styles';
+import { SelectionStyle, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles } from '@atlaskit/editor-shared-styles';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
@@ -162,9 +162,9 @@ 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--ak-editor--breakout-fallback-width: calc(\n\t\t100cqw - var(--ak-editor--breakout-full-page-guttering-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\n\t\t/* in full width appearances it's not possible to rely on cqw because it doesn't account for the page scrollbar, which depends on users system settings */\n\t\t--ak-editor--breakout-fallback-width: 100%;\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\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\t", "\n  /* Switch between the two icons based on the visual refresh feature gate */\n\t", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\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--ak-editor--breakout-fallback-width: calc(\n\t\t100cqw - var(--ak-editor--breakout-full-page-guttering-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\n\t\t/* in full width appearances it's not possible to rely on cqw because it doesn't account for the page scrollbar, which depends on users system settings */\n\t\t--ak-editor--breakout-fallback-width: 100%;\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", "\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\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\t", "\n  /* Switch between the two icons based on the visual refresh feature gate */\n\t", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\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, expValEqualsNoExposure('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? css(_templateObject0 || (_templateObject0 = _taggedTemplateLiteral(["\n\t\t\t\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t\t\t\t@container editor-area (max-width: ", "px) {\n\t\t\t\t\t--ak-editor--large-gutter-padding: ", "px;\n\t\t\t\t}\n\t\t\t"])), akEditorFullPageNarrowBreakout, akEditorGutterPaddingReduced) : null, 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)", firstFloatingToolbarButtonStyles, placeholderTextStyles, fg('platform_editor_system_fake_text_highlight_colour') && placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour, 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, mentionNodeStyles, fg('platform_editor_centre_mention_padding') && mentionNodeStylesMixin_fg_platform_editor_centre_mention_padding, expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) && fg('platform_editor_find_and_replace_improvements_1') ? mentionsSelectionStylesWithSearchMatch : mentionSelectionStyles, emojiStyles, tasksAndDecisionsStyles, gridStyles, linkStyles, blockMarksSharedStyles, dateSharedStyle, extensionStyles, expandStyles(), expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? fg('platform_editor_find_and_replace_improvements_1') ? findReplaceStylesNewNoImportant : findReplaceStylesNew : findReplaceStyles, textHighlightStyle, taskDecisionStyles, taskItemStyles, fg('platform-visual-refresh-icons') && decisionIconWithVisualRefresh, !fg('platform-visual-refresh-icons') && decisionIconWithoutVisualRefresh, statusStyles(), statusNodeStyles(), annotationSharedStyles(), smartCardStyles(), getSmartCardSharedStyles(), dateStyles, dateNodeStyles, embedCardStyles(), unsupportedStyles, resizerStyles, pragmaticResizerStyles(), pragmaticStylesLayoutFirstNodeResizeHandleFix(), pragmaticResizerStylesForTooltip(), aiPanelStyles(props.colorMode), firstBlockNodeStylesNew, fg('platform_editor_vanilla_codebidi_warning') && codeBidiWarningStyles, 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);
+  }), whitespaceSharedStyles, paragraphSharedStyles(props.typographyTheme), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('platform_editor_hide_cursor_when_pm_hideselection') ? 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, editorExperiment('platform_editor_advanced_code_blocks', true) ? css(_templateObject10 || (_templateObject10 = _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)", firstFloatingToolbarButtonStyles, placeholderTextStyles, fg('platform_editor_system_fake_text_highlight_colour') && placeholderTextStyles_fg_platform_editor_system_fake_text_highlight_colour, 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, mentionNodeStyles, fg('platform_editor_centre_mention_padding') && mentionNodeStylesMixin_fg_platform_editor_centre_mention_padding, expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) && fg('platform_editor_find_and_replace_improvements_1') ? mentionsSelectionStylesWithSearchMatch : mentionSelectionStyles, emojiStyles, tasksAndDecisionsStyles, gridStyles, linkStyles, blockMarksSharedStyles, dateSharedStyle, extensionStyles, expandStyles(), expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? fg('platform_editor_find_and_replace_improvements_1') ? findReplaceStylesNewNoImportant : findReplaceStylesNew : findReplaceStyles, textHighlightStyle, taskDecisionStyles, taskItemStyles, fg('platform-visual-refresh-icons') && decisionIconWithVisualRefresh, !fg('platform-visual-refresh-icons') && decisionIconWithoutVisualRefresh, statusStyles(), statusNodeStyles(), annotationSharedStyles(), smartCardStyles(), getSmartCardSharedStyles(), dateStyles, dateNodeStyles, embedCardStyles(), unsupportedStyles, resizerStyles, pragmaticResizerStyles(), pragmaticStylesLayoutFirstNodeResizeHandleFix(), pragmaticResizerStylesForTooltip(), aiPanelStyles(props.colorMode), firstBlockNodeStylesNew, fg('platform_editor_vanilla_codebidi_warning') && codeBidiWarningStyles, MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT, !fg('platform-visual-refresh-icons') ? css(_templateObject11 || (_templateObject11 = _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);
 };
 export var createEditorContentStyle = function createEditorContentStyle(styles) {
   return /*#__PURE__*/React.forwardRef(function (props, ref) {

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

@@ -18,7 +18,7 @@ import { useThemeObserver } from '@atlaskit/tokens';
 import { aiPanelBaseFirefoxStyles, aiPanelBaseStyles, aiPanelDarkFirefoxStyles, aiPanelDarkStyles } from './styles/aiPanel';
 import { annotationStyles } from './styles/annotationStyles';
 import { backgroundColorStyles } from './styles/backgroundColorStyles';
-import { baseStyles } from './styles/baseStyles';
+import { baseStyles, editorLargeGutterPuddingBaseStyles, editorLargeGutterPuddingBaseStylesEditorControls, editorLargeGutterPuddingReducedBaseStyles } from './styles/baseStyles';
 import { blockMarksStyles } from './styles/blockMarksStyles';
 import { blocktypeStyles, blocktypeStyles_fg_platform_editor_nested_dnd_styles_changes, blocktypeStyles_fg_platform_editor_typography_ugc, blocktypeStyles_without_fg_platform_editor_typography_ugc } from './styles/blockTypeStyles';
 import { codeBidiWarningStyles } from './styles/codeBidiWarningStyles';
@@ -82,6 +82,19 @@ var EditorContentContainer = /*#__PURE__*/React.forwardRef(function (props, ref)
     colorMode = _useThemeObserver.colorMode;
   var isFullPage = appearance === 'full-page' || appearance === 'full-width';
   var isComment = appearance === 'comment';
+  var style = expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    '--ak-editor-base-font-size': "".concat(editorFontSize({
+      theme: theme
+    }), "px")
+  } : {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    '--ak-editor-base-font-size': "".concat(editorFontSize({
+      theme: theme
+    }), "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    '--ak-editor--large-gutter-padding': "".concat(akEditorGutterPaddingDynamic(), "px")
+  };
   return jsx("div", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     className: className,
@@ -89,6 +102,14 @@ var EditorContentContainer = /*#__PURE__*/React.forwardRef(function (props, ref)
     css: [
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     baseStyles,
+    // eslint-disable-next-line @atlaskit/platform/no-preconditioning
+    fg('platform_editor_controls_increase_full_page_gutter') && editorExperiment('platform_editor_controls', 'variant1') ?
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    editorLargeGutterPuddingBaseStylesEditorControls :
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    editorLargeGutterPuddingBaseStyles, expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) &&
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+    editorLargeGutterPuddingReducedBaseStyles,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     whitespaceStyles,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -334,15 +355,10 @@ var EditorContentContainer = /*#__PURE__*/React.forwardRef(function (props, ref)
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
     fg('platform_editor_vanilla_codebidi_warning') && codeBidiWarningStyles],
     "data-editor-scroll-container": isScrollable ? 'true' : undefined,
-    "data-testid": "editor-content-container",
-    style: {
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-      '--ak-editor-base-font-size': "".concat(editorFontSize({
-        theme: theme
-      }), "px"),
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
-      '--ak-editor--large-gutter-padding': "".concat(akEditorGutterPaddingDynamic(), "px")
-    }
+    "data-testid": "editor-content-container"
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
+    ,
+    style: style
   }, children);
 });
 export default EditorContentContainer;

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

@@ -11,6 +11,8 @@ var akEditorDefaultLayoutWidth = 760;
 var akEditorFullWidthLayoutWidth = 1800;
 // The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
 var akEditorBreakpointForSmallDevice = "1266px";
+var akEditorGutterPaddingReduced = 24;
+var akEditorFullPageNarrowBreakout = 768;
 
 // jest warning: JSDOM version (22) doesn't support the new @container CSS rule
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
@@ -46,4 +48,21 @@ export var baseStyles = css(_defineProperty({
   '.ProseMirror': {
     '--ak-editor--breakout-wide-layout-width': "".concat(akEditorCalculatedWideLayoutWidth, "px")
   }
+}));
+
+// This is to avoid using akEditorGutterPaddingDynamic()
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export var editorLargeGutterPuddingBaseStyles = css({
+  '--ak-editor--large-gutter-padding': '52px'
+});
+
+// This is to avoid using akEditorGutterPaddingDynamic
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export var editorLargeGutterPuddingBaseStylesEditorControls = css({
+  '--ak-editor--large-gutter-padding': '72px'
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+export var editorLargeGutterPuddingReducedBaseStyles = css(_defineProperty({}, "@container editor-area (max-width: ".concat(akEditorFullPageNarrowBreakout, "px)"), {
+  '--ak-editor--large-gutter-padding': "".concat(akEditorGutterPaddingReduced, "px")
 }));

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

@@ -3,7 +3,7 @@ import { css, keyframes } from '@emotion/react'; // eslint-disable-line @atlaski
 var fadeIn = keyframes({
   from: {
     opacity: 0,
-    transform: 'translateY(-16px)'
+    transform: 'translateY(16px)'
   },
   to: {
     opacity: 1,

package/dist/esm/version-wrapper.js

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

package/dist/types/ui/EditorContentContainer/styles/baseStyles.d.ts

@@ -1 +1,4 @@
 export declare const baseStyles: import("@emotion/react").SerializedStyles;
+export declare const editorLargeGutterPuddingBaseStyles: import("@emotion/react").SerializedStyles;
+export declare const editorLargeGutterPuddingBaseStylesEditorControls: import("@emotion/react").SerializedStyles;
+export declare const editorLargeGutterPuddingReducedBaseStyles: import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/ui/EditorContentContainer/styles/baseStyles.d.ts

@@ -1 +1,4 @@
 export declare const baseStyles: import("@emotion/react").SerializedStyles;
+export declare const editorLargeGutterPuddingBaseStyles: import("@emotion/react").SerializedStyles;
+export declare const editorLargeGutterPuddingBaseStylesEditorControls: import("@emotion/react").SerializedStyles;
+export declare const editorLargeGutterPuddingReducedBaseStyles: import("@emotion/react").SerializedStyles;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "209.1.8",
+	"version": "209.1.10",
 	"description": "A package contains Atlassian editor core functionality",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -51,7 +51,7 @@
 		"@atlaskit/editor-plugin-user-preferences": "^1.1.0",
 		"@atlaskit/editor-plugins": "^9.4.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
-		"@atlaskit/editor-shared-styles": "^3.4.0",
+		"@atlaskit/editor-shared-styles": "^3.5.0",
 		"@atlaskit/emoji": "^69.3.0",
 		"@atlaskit/icon": "^27.3.0",
 		"@atlaskit/link": "^3.2.0",
@@ -61,7 +61,7 @@
 		"@atlaskit/platform-feature-flags-react": "^0.2.0",
 		"@atlaskit/react-ufo": "^4.0.0",
 		"@atlaskit/task-decision": "^19.2.0",
-		"@atlaskit/tmp-editor-statsig": "^9.7.0",
+		"@atlaskit/tmp-editor-statsig": "^9.8.0",
 		"@atlaskit/tokens": "^5.5.0",
 		"@atlaskit/tooltip": "^20.3.0",
 		"@atlaskit/width-detector": "^5.0.0",
@@ -104,7 +104,7 @@
 		"@atlaskit/primitives": "^14.10.0",
 		"@atlaskit/renderer": "^120.1.0",
 		"@atlaskit/section-message": "^8.2.0",
-		"@atlaskit/smart-card": "^40.2.0",
+		"@atlaskit/smart-card": "^40.3.0",
 		"@atlaskit/synchrony-test-helpers": "workspace:^",
 		"@atlaskit/toggle": "^15.0.0",
 		"@atlaskit/util-data-test": "^18.0.0",
@@ -492,10 +492,6 @@
 			"type": "boolean",
 			"referenceOnly": true
 		},
-		"platform_editor_controls_patch_13": {
-			"type": "boolean",
-			"referenceOnly": true
-		},
 		"platform_editor_hyperlink_underline": {
 			"type": "boolean",
 			"referenceOnly": true
@@ -511,10 +507,6 @@
 			"type": "boolean",
 			"referenceOnly": true
 		},
-		"platform_editor_controls_toolbar_ssr_fix": {
-			"type": "boolean",
-			"referenceOnly": true
-		},
 		"platform_editor_refactor_view_more": {
 			"type": "boolean",
 			"referenceOnly": true