@atlaskit/editor-core 193.24.19 → 193.24.20

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @atlaskit/editor-core
 
+## 193.24.20
+
+### Patch Changes
+
+- [#105253](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/105253)
+  [`a5f3cd26fbd6`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/a5f3cd26fbd6) -
+  Clean up platform.editor.enable-localid-for-paragraph-in-stage-0_cby7g FF
+- [#108295](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/108295)
+  [`965a0e6c1088`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/965a0e6c1088) -
+  NO-ISSUE Condition adding primary toolbar plugin components based on their presence instead of on
+  the feature flag to avoid it not rendering in examples
+- [#106586](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/106586)
+  [`861ecd061c72`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/861ecd061c72) -
+  Increase the editor page guttering for full page appearance to support block drag and drop
+- [#105533](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/105533)
+  [`ba448905afaf`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ba448905afaf) -
+  ED-23459: Extracts example-helpers to editor-examples-helpers
+- [#100714](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/100714)
+  [`81849acfe13c`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/81849acfe13c) -
+  ECA11Y-228: Added new shortcuts for insert column and row and added correct formatting for help
+  modal dialog
+- Updated dependencies
+
 ## 193.24.19
 
 ### Patch Changes

package/create-editor-content-style/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "@atlaskit/editor-core/create-editor-content-style",
+  "main": "../dist/cjs/ui/ContentStyles/index.js",
+  "module": "../dist/esm/ui/ContentStyles/index.js",
+  "module:es2019": "../dist/es2019/ui/ContentStyles/index.js",
+  "sideEffects": false,
+  "types": "../dist/types/ui/ContentStyles/index.d.ts",
+  "typesVersions": {
+    ">=4.5 <5.4": {
+      "*": [
+        "../dist/types-ts4.5/ui/ContentStyles/index.d.ts"
+      ]
+    }
+  }
+}

package/dist/cjs/index.js

@@ -130,6 +130,12 @@ Object.defineProperty(exports, "WithHelpTrigger", {
     return _WithHelpTrigger.default;
   }
 });
+Object.defineProperty(exports, "createEditorContentStyle", {
+  enumerable: true,
+  get: function get() {
+    return _ContentStyles.createEditorContentStyle;
+  }
+});
 Object.defineProperty(exports, "getNodesCount", {
   enumerable: true,
   get: function get() {
@@ -178,6 +184,7 @@ var _analytics = require("@atlaskit/editor-common/analytics");
 var _utils = require("./utils");
 var _actions = _interopRequireDefault(require("./actions"));
 var _portalProvider = require("@atlaskit/editor-common/portal-provider");
+var _ContentStyles = require("./ui/ContentStyles");
 // [ED-22843] use FF in editor-core for sake of example
 
 // Used in products integration code

package/dist/cjs/keymaps/index.js

@@ -93,12 +93,24 @@ Object.defineProperty(exports, "addColumnAfter", {
     return _keymaps.addColumnAfter;
   }
 });
+Object.defineProperty(exports, "addColumnAfterVO", {
+  enumerable: true,
+  get: function get() {
+    return _keymaps.addColumnAfterVO;
+  }
+});
 Object.defineProperty(exports, "addColumnBefore", {
   enumerable: true,
   get: function get() {
     return _keymaps.addColumnBefore;
   }
 });
+Object.defineProperty(exports, "addColumnBeforeVO", {
+  enumerable: true,
+  get: function get() {
+    return _keymaps.addColumnBeforeVO;
+  }
+});
 Object.defineProperty(exports, "addInlineComment", {
   enumerable: true,
   get: function get() {
@@ -117,12 +129,24 @@ Object.defineProperty(exports, "addRowAfter", {
     return _keymaps.addRowAfter;
   }
 });
+Object.defineProperty(exports, "addRowAfterVO", {
+  enumerable: true,
+  get: function get() {
+    return _keymaps.addRowAfterVO;
+  }
+});
 Object.defineProperty(exports, "addRowBefore", {
   enumerable: true,
   get: function get() {
     return _keymaps.addRowBefore;
   }
 });
+Object.defineProperty(exports, "addRowBeforeVO", {
+  enumerable: true,
+  get: function get() {
+    return _keymaps.addRowBeforeVO;
+  }
+});
 Object.defineProperty(exports, "alignCenter", {
   enumerable: true,
   get: function get() {

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

@@ -145,10 +145,8 @@ var Editor = /*#__PURE__*/function (_React$Component) {
         event.stopPropagation();
       };
       var primaryToolbarComponents = primaryToolbarComponentsProp;
-      if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.primary-toolbar-ordering')) {
-        if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
-          primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
-        }
+      if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
+        primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
       }
       return (0, _react2.jsx)(_WithFlash.default, {
         animate: maxContentSizeReached
@@ -342,10 +340,8 @@ var EditorNext = function EditorNext(props) {
     event.stopPropagation();
   }, [editorView]);
   var primaryToolbarComponents = primaryToolbarComponentsProp;
-  if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.primary-toolbar-ordering')) {
-    if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
-      primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
-    }
+  if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
+    primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
   }
   return (0, _react2.jsx)(_WithFlash.default, {
     animate: maxContentSizeReached

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

@@ -12,7 +12,6 @@ var _react2 = require("@emotion/react");
 var _hooks = require("@atlaskit/editor-common/hooks");
 var _ui = require("@atlaskit/editor-common/ui");
 var _utils = require("@atlaskit/editor-common/utils");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _context = require("../../../presets/context");
 var _FullPageContentArea = require("./FullPageContentArea");
 var _FullPageToolbar = require("./FullPageToolbar");
@@ -62,10 +61,8 @@ var FullPageEditor = exports.FullPageEditor = function FullPageEditor(props) {
     editorViewModeState = _useSharedPluginState.editorViewModeState,
     primaryToolbarState = _useSharedPluginState.primaryToolbarState;
   var primaryToolbarComponents = props.primaryToolbarComponents;
-  if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.primary-toolbar-ordering')) {
-    if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
-      primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
-    }
+  if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
+    primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
   }
   var isEditorToolbarHidden = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
   return (0, _react2.jsx)(_ui.ContextPanelWidthProvider, null, (0, _react2.jsx)("div", {

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

@@ -11,11 +11,14 @@ var _adfSchema = require("@atlaskit/adf-schema");
 var _commonStyles = require("@atlaskit/editor-plugins/table/ui/common-styles");
 var _consts = require("@atlaskit/editor-plugins/table/ui/consts");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _ContentStyles = require("../../ContentStyles");
 var _styles = require("../../styles");
 var _ProseMirror;
 var SWOOP_ANIMATION = "0.5s ".concat(_editorSharedStyles.akEditorSwoopCubicBezier);
-var TOTAL_PADDING = _editorSharedStyles.akEditorGutterPadding * 2;
+var getTotalPadding = function getTotalPadding() {
+  return (0, _editorSharedStyles.akEditorGutterPaddingDynamic)() * 2;
+};
 var fullPageEditorWrapper = exports.fullPageEditorWrapper = (0, _react.css)({
   minWidth: '340px',
   height: '100%',
@@ -83,7 +86,7 @@ var editorContentAreaContainerStyle = function editorContentAreaContainerStyle(c
   return (0, _react.css)({
     '.fabric-editor--full-width-mode': {
       '.code-block, .extension-container': {
-        maxWidth: "".concat(containerWidth - TOTAL_PADDING - _consts.tableMarginFullWidthMode * 2, "px")
+        maxWidth: "".concat(containerWidth - getTotalPadding() - _consts.tableMarginFullWidthMode * 2, "px")
       },
       '.extension-container.inline': {
         maxWidth: '100%'
@@ -92,10 +95,10 @@ var editorContentAreaContainerStyle = function editorContentAreaContainerStyle(c
         maxWidth: 'inherit'
       },
       '.multiBodiedExtension--container': {
-        maxWidth: "".concat(containerWidth - TOTAL_PADDING - _consts.tableMarginFullWidthMode * 2, "px")
+        maxWidth: "".concat(containerWidth - getTotalPadding() - _consts.tableMarginFullWidthMode * 2, "px")
       },
       '[data-layout-section]': {
-        maxWidth: "".concat(containerWidth - TOTAL_PADDING + _editorSharedStyles.akLayoutGutterOffset * 2, "px")
+        maxWidth: "".concat(containerWidth - getTotalPadding() + _editorSharedStyles.akLayoutGutterOffset * 2, "px")
       }
     }
   });
@@ -108,7 +111,8 @@ var editorContentAreaStyle = exports.editorContentAreaStyle = function editorCon
 };
 var editorContentAreaWithLayoutWith = function editorContentAreaWithLayoutWith(layoutMaxWidth) {
   return (0, _react.css)({
-    maxWidth: "".concat(layoutMaxWidth + TOTAL_PADDING, "px")
+    // this restricts max width
+    maxWidth: "".concat(layoutMaxWidth + getTotalPadding(), "px")
   });
 };
 var editorContentArea = (0, _react.css)({
@@ -120,7 +124,7 @@ var editorContentArea = (0, _react.css)({
   margin: 'auto',
   flexDirection: 'column',
   flexGrow: 1,
-  maxWidth: "".concat(_editorSharedStyles.akEditorFullWidthLayoutWidth + TOTAL_PADDING, "px"),
+  maxWidth: "".concat(_editorSharedStyles.akEditorFullWidthLayoutWidth + getTotalPadding(), "px"),
   transition: "max-width ".concat(SWOOP_ANIMATION),
   '& .ProseMirror': (_ProseMirror = {
     flexGrow: 1,
@@ -147,5 +151,6 @@ var editorContentArea = (0, _react.css)({
 });
 var editorContentGutterStyle = exports.editorContentGutterStyle = (0, _react.css)({
   boxSizing: 'border-box',
-  padding: "0 ".concat("var(--ds-space-400, 32px)")
+  padding: (0, _platformFeatureFlags.getBooleanFF)('platform.editor.core.increase-full-page-guttering') ? // there is no space token for 52px
+  "0 52px" : "0 ".concat("var(--ds-space-400, 32px)")
 });

package/dist/cjs/version-wrapper.js

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

package/dist/es2019/index.js

@@ -59,4 +59,5 @@ const ignoreFunction = () => {
   // eslint-disable-next-line @atlaskit/platform/no-invalid-feature-flag-usage, @atlaskit/platform/ensure-feature-flag-prefix
   getBooleanFF('__live-view-toggle');
   return;
-};
+};
+export { createEditorContentStyle } from './ui/ContentStyles';

package/dist/es2019/keymaps/index.js

@@ -1 +1 @@
-export { addAltText, navToEditorToolbar, navToFloatingToolbar, toggleBold, toggleItalic, toggleUnderline, toggleStrikethrough, toggleSubscript, toggleSuperscript, toggleCode, pastePlainText, clearFormatting, setNormalText, toggleHeading1, toggleHeading2, toggleHeading3, toggleHeading4, toggleHeading5, toggleHeading6, toggleOrderedList, toggleTaskItemCheckbox, ctrlBackSpace, toggleBulletList, toggleBlockQuote, insertNewLine, shiftBackspace, splitCodeBlock, splitListItem, insertRule, undo, moveUp, moveDown, moveLeft, moveRight, indentList, outdentList, redo, openHelp, addLink, addInlineComment, submit, enter, shiftEnter, tab, indent, outdent, backspace, deleteKey, forwardDelete, space, escape, nextCell, previousCell, shiftTab, toggleTable, addRowBefore, addRowAfter, addColumnAfter, addColumnBefore, deleteColumn, deleteRow, moveColumnLeft, moveColumnRight, moveRowDown, moveRowUp, cut, copy, paste, altPaste, find, alignCenter, alignLeft, alignRight, tooltip, ToolTipContent, findKeymapByDescription, findShortcutByDescription, findShortcutByKeymap, makeKeymap, makeKeyMapWithCommon, bindKeymapWithCommand, findKeyMapForBrowser, DOWN, HEADING_KEYS, KEY_0, KEY_1, KEY_2, KEY_3, KEY_4, KEY_5, KEY_6, LEFT, RIGHT, UP } from '@atlaskit/editor-common/keymaps';
+export { addAltText, navToEditorToolbar, navToFloatingToolbar, toggleBold, toggleItalic, toggleUnderline, toggleStrikethrough, toggleSubscript, toggleSuperscript, toggleCode, pastePlainText, clearFormatting, setNormalText, toggleHeading1, toggleHeading2, toggleHeading3, toggleHeading4, toggleHeading5, toggleHeading6, toggleOrderedList, toggleTaskItemCheckbox, ctrlBackSpace, toggleBulletList, toggleBlockQuote, insertNewLine, shiftBackspace, splitCodeBlock, splitListItem, insertRule, undo, moveUp, moveDown, moveLeft, moveRight, indentList, outdentList, redo, openHelp, addLink, addInlineComment, submit, enter, shiftEnter, tab, indent, outdent, backspace, deleteKey, forwardDelete, space, escape, nextCell, previousCell, shiftTab, toggleTable, addRowBefore, addRowAfter, addColumnAfter, addColumnBefore, addRowBeforeVO, addRowAfterVO, addColumnAfterVO, addColumnBeforeVO, deleteColumn, deleteRow, moveColumnLeft, moveColumnRight, moveRowDown, moveRowUp, cut, copy, paste, altPaste, find, alignCenter, alignLeft, alignRight, tooltip, ToolTipContent, findKeymapByDescription, findShortcutByDescription, findShortcutByKeymap, makeKeymap, makeKeyMapWithCommon, bindKeymapWithCommand, findKeyMapForBrowser, DOWN, HEADING_KEYS, KEY_0, KEY_1, KEY_2, KEY_3, KEY_4, KEY_5, KEY_6, LEFT, RIGHT, UP } from '@atlaskit/editor-common/keymaps';

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

@@ -124,10 +124,8 @@ class Editor extends React.Component {
         event.stopPropagation();
       };
       let primaryToolbarComponents = primaryToolbarComponentsProp;
-      if (getBooleanFF('platform.editor.primary-toolbar-ordering')) {
-        if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
-          primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
-        }
+      if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
+        primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
       }
       return jsx(WithFlash, {
         animate: maxContentSizeReached
@@ -312,10 +310,8 @@ const EditorNext = props => {
     event.stopPropagation();
   }, [editorView]);
   let primaryToolbarComponents = primaryToolbarComponentsProp;
-  if (getBooleanFF('platform.editor.primary-toolbar-ordering')) {
-    if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
-      primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
-    }
+  if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
+    primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
   }
   return jsx(WithFlash, {
     animate: maxContentSizeReached

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

@@ -4,7 +4,6 @@ import { jsx } from '@emotion/react';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { ContextPanelWidthProvider } from '@atlaskit/editor-common/ui';
 import { browser } from '@atlaskit/editor-common/utils';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { usePresetContext } from '../../../presets/context';
 import { FullPageContentArea } from './FullPageContentArea';
 import { FullPageToolbar } from './FullPageToolbar';
@@ -44,10 +43,8 @@ export const FullPageEditor = props => {
     primaryToolbarState
   } = useSharedPluginState(editorAPI, ['editorViewMode', 'primaryToolbar']);
   let primaryToolbarComponents = props.primaryToolbarComponents;
-  if (getBooleanFF('platform.editor.primary-toolbar-ordering')) {
-    if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
-      primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
-    }
+  if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
+    primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
   }
   const isEditorToolbarHidden = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
   return jsx(ContextPanelWidthProvider, null, jsx("div", {

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

@@ -2,11 +2,12 @@ import { css } from '@emotion/react';
 import { decisionListSelector, taskListSelector } from '@atlaskit/adf-schema';
 import { tableFullPageEditorStyles } from '@atlaskit/editor-plugins/table/ui/common-styles';
 import { tableMarginFullWidthMode } from '@atlaskit/editor-plugins/table/ui/consts';
-import { akEditorContextPanelWidth, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorSwoopCubicBezier, akLayoutGutterOffset, FULL_PAGE_EDITOR_TOOLBAR_HEIGHT } from '@atlaskit/editor-shared-styles';
+import { akEditorContextPanelWidth, akEditorFullWidthLayoutWidth, akEditorGutterPaddingDynamic, akEditorSwoopCubicBezier, akLayoutGutterOffset, FULL_PAGE_EDITOR_TOOLBAR_HEIGHT } from '@atlaskit/editor-shared-styles';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { createEditorContentStyle } from '../../ContentStyles';
 import { scrollbarStyles } from '../../styles';
 const SWOOP_ANIMATION = `0.5s ${akEditorSwoopCubicBezier}`;
-const TOTAL_PADDING = akEditorGutterPadding * 2;
+const getTotalPadding = () => akEditorGutterPaddingDynamic() * 2;
 export const fullPageEditorWrapper = css({
   minWidth: '340px',
   height: '100%',
@@ -73,7 +74,7 @@ export const editorContentAreaHideContainer = css({
 const editorContentAreaContainerStyle = containerWidth => css({
   '.fabric-editor--full-width-mode': {
     '.code-block, .extension-container': {
-      maxWidth: `${containerWidth - TOTAL_PADDING - tableMarginFullWidthMode * 2}px`
+      maxWidth: `${containerWidth - getTotalPadding() - tableMarginFullWidthMode * 2}px`
     },
     '.extension-container.inline': {
       maxWidth: '100%'
@@ -82,10 +83,10 @@ const editorContentAreaContainerStyle = containerWidth => css({
       maxWidth: 'inherit'
     },
     '.multiBodiedExtension--container': {
-      maxWidth: `${containerWidth - TOTAL_PADDING - tableMarginFullWidthMode * 2}px`
+      maxWidth: `${containerWidth - getTotalPadding() - tableMarginFullWidthMode * 2}px`
     },
     '[data-layout-section]': {
-      maxWidth: `${containerWidth - TOTAL_PADDING + akLayoutGutterOffset * 2}px`
+      maxWidth: `${containerWidth - getTotalPadding() + akLayoutGutterOffset * 2}px`
     }
   }
 });
@@ -95,7 +96,8 @@ export const editorContentAreaStyle = ({
   containerWidth
 }) => [editorContentArea, !fullWidthMode && editorContentAreaWithLayoutWith(layoutMaxWidth), containerWidth ? editorContentAreaContainerStyle(containerWidth) : editorContentAreaHideContainer];
 const editorContentAreaWithLayoutWith = layoutMaxWidth => css({
-  maxWidth: `${layoutMaxWidth + TOTAL_PADDING}px`
+  // this restricts max width
+  maxWidth: `${layoutMaxWidth + getTotalPadding()}px`
 });
 const editorContentArea = css({
   lineHeight: '24px',
@@ -106,7 +108,7 @@ const editorContentArea = css({
   margin: 'auto',
   flexDirection: 'column',
   flexGrow: 1,
-  maxWidth: `${akEditorFullWidthLayoutWidth + TOTAL_PADDING}px`,
+  maxWidth: `${akEditorFullWidthLayoutWidth + getTotalPadding()}px`,
   transition: `max-width ${SWOOP_ANIMATION}`,
   '& .ProseMirror': {
     flexGrow: 1,
@@ -135,5 +137,7 @@ const editorContentArea = css({
 });
 export const editorContentGutterStyle = css({
   boxSizing: 'border-box',
-  padding: `0 ${"var(--ds-space-400, 32px)"}`
+  padding: getBooleanFF('platform.editor.core.increase-full-page-guttering') ?
+  // there is no space token for 52px
+  `0 52px` : `0 ${"var(--ds-space-400, 32px)"}`
 });

package/dist/es2019/version-wrapper.js

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

package/dist/esm/index.js

@@ -59,4 +59,5 @@ var ignoreFunction = function ignoreFunction() {
   // eslint-disable-next-line @atlaskit/platform/no-invalid-feature-flag-usage, @atlaskit/platform/ensure-feature-flag-prefix
   getBooleanFF('__live-view-toggle');
   return;
-};
+};
+export { createEditorContentStyle } from './ui/ContentStyles';

package/dist/esm/keymaps/index.js

@@ -1 +1 @@
-export { addAltText, navToEditorToolbar, navToFloatingToolbar, toggleBold, toggleItalic, toggleUnderline, toggleStrikethrough, toggleSubscript, toggleSuperscript, toggleCode, pastePlainText, clearFormatting, setNormalText, toggleHeading1, toggleHeading2, toggleHeading3, toggleHeading4, toggleHeading5, toggleHeading6, toggleOrderedList, toggleTaskItemCheckbox, ctrlBackSpace, toggleBulletList, toggleBlockQuote, insertNewLine, shiftBackspace, splitCodeBlock, splitListItem, insertRule, undo, moveUp, moveDown, moveLeft, moveRight, indentList, outdentList, redo, openHelp, addLink, addInlineComment, submit, enter, shiftEnter, tab, indent, outdent, backspace, deleteKey, forwardDelete, space, escape, nextCell, previousCell, shiftTab, toggleTable, addRowBefore, addRowAfter, addColumnAfter, addColumnBefore, deleteColumn, deleteRow, moveColumnLeft, moveColumnRight, moveRowDown, moveRowUp, cut, copy, paste, altPaste, find, alignCenter, alignLeft, alignRight, tooltip, ToolTipContent, findKeymapByDescription, findShortcutByDescription, findShortcutByKeymap, makeKeymap, makeKeyMapWithCommon, bindKeymapWithCommand, findKeyMapForBrowser, DOWN, HEADING_KEYS, KEY_0, KEY_1, KEY_2, KEY_3, KEY_4, KEY_5, KEY_6, LEFT, RIGHT, UP } from '@atlaskit/editor-common/keymaps';
+export { addAltText, navToEditorToolbar, navToFloatingToolbar, toggleBold, toggleItalic, toggleUnderline, toggleStrikethrough, toggleSubscript, toggleSuperscript, toggleCode, pastePlainText, clearFormatting, setNormalText, toggleHeading1, toggleHeading2, toggleHeading3, toggleHeading4, toggleHeading5, toggleHeading6, toggleOrderedList, toggleTaskItemCheckbox, ctrlBackSpace, toggleBulletList, toggleBlockQuote, insertNewLine, shiftBackspace, splitCodeBlock, splitListItem, insertRule, undo, moveUp, moveDown, moveLeft, moveRight, indentList, outdentList, redo, openHelp, addLink, addInlineComment, submit, enter, shiftEnter, tab, indent, outdent, backspace, deleteKey, forwardDelete, space, escape, nextCell, previousCell, shiftTab, toggleTable, addRowBefore, addRowAfter, addColumnAfter, addColumnBefore, addRowBeforeVO, addRowAfterVO, addColumnAfterVO, addColumnBeforeVO, deleteColumn, deleteRow, moveColumnLeft, moveColumnRight, moveRowDown, moveRowUp, cut, copy, paste, altPaste, find, alignCenter, alignLeft, alignRight, tooltip, ToolTipContent, findKeymapByDescription, findShortcutByDescription, findShortcutByKeymap, makeKeymap, makeKeyMapWithCommon, bindKeymapWithCommand, findKeyMapForBrowser, DOWN, HEADING_KEYS, KEY_0, KEY_1, KEY_2, KEY_3, KEY_4, KEY_5, KEY_6, LEFT, RIGHT, UP } from '@atlaskit/editor-common/keymaps';

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

@@ -136,10 +136,8 @@ var Editor = /*#__PURE__*/function (_React$Component) {
         event.stopPropagation();
       };
       var primaryToolbarComponents = primaryToolbarComponentsProp;
-      if (getBooleanFF('platform.editor.primary-toolbar-ordering')) {
-        if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
-          primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
-        }
+      if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
+        primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
       }
       return jsx(WithFlash, {
         animate: maxContentSizeReached
@@ -333,10 +331,8 @@ var EditorNext = function EditorNext(props) {
     event.stopPropagation();
   }, [editorView]);
   var primaryToolbarComponents = primaryToolbarComponentsProp;
-  if (getBooleanFF('platform.editor.primary-toolbar-ordering')) {
-    if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
-      primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
-    }
+  if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
+    primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
   }
   return jsx(WithFlash, {
     animate: maxContentSizeReached

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

@@ -5,7 +5,6 @@ import { jsx } from '@emotion/react';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { ContextPanelWidthProvider } from '@atlaskit/editor-common/ui';
 import { browser } from '@atlaskit/editor-common/utils';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { usePresetContext } from '../../../presets/context';
 import { FullPageContentArea } from './FullPageContentArea';
 import { FullPageToolbar } from './FullPageToolbar';
@@ -51,10 +50,8 @@ export var FullPageEditor = function FullPageEditor(props) {
     editorViewModeState = _useSharedPluginState.editorViewModeState,
     primaryToolbarState = _useSharedPluginState.primaryToolbarState;
   var primaryToolbarComponents = props.primaryToolbarComponents;
-  if (getBooleanFF('platform.editor.primary-toolbar-ordering')) {
-    if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
-      primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
-    }
+  if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
+    primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
   }
   var isEditorToolbarHidden = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
   return jsx(ContextPanelWidthProvider, null, jsx("div", {

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

@@ -4,11 +4,14 @@ import { css } from '@emotion/react';
 import { decisionListSelector, taskListSelector } from '@atlaskit/adf-schema';
 import { tableFullPageEditorStyles } from '@atlaskit/editor-plugins/table/ui/common-styles';
 import { tableMarginFullWidthMode } from '@atlaskit/editor-plugins/table/ui/consts';
-import { akEditorContextPanelWidth, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorSwoopCubicBezier, akLayoutGutterOffset, FULL_PAGE_EDITOR_TOOLBAR_HEIGHT } from '@atlaskit/editor-shared-styles';
+import { akEditorContextPanelWidth, akEditorFullWidthLayoutWidth, akEditorGutterPaddingDynamic, akEditorSwoopCubicBezier, akLayoutGutterOffset, FULL_PAGE_EDITOR_TOOLBAR_HEIGHT } from '@atlaskit/editor-shared-styles';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { createEditorContentStyle } from '../../ContentStyles';
 import { scrollbarStyles } from '../../styles';
 var SWOOP_ANIMATION = "0.5s ".concat(akEditorSwoopCubicBezier);
-var TOTAL_PADDING = akEditorGutterPadding * 2;
+var getTotalPadding = function getTotalPadding() {
+  return akEditorGutterPaddingDynamic() * 2;
+};
 export var fullPageEditorWrapper = css({
   minWidth: '340px',
   height: '100%',
@@ -76,7 +79,7 @@ var editorContentAreaContainerStyle = function editorContentAreaContainerStyle(c
   return css({
     '.fabric-editor--full-width-mode': {
       '.code-block, .extension-container': {
-        maxWidth: "".concat(containerWidth - TOTAL_PADDING - tableMarginFullWidthMode * 2, "px")
+        maxWidth: "".concat(containerWidth - getTotalPadding() - tableMarginFullWidthMode * 2, "px")
       },
       '.extension-container.inline': {
         maxWidth: '100%'
@@ -85,10 +88,10 @@ var editorContentAreaContainerStyle = function editorContentAreaContainerStyle(c
         maxWidth: 'inherit'
       },
       '.multiBodiedExtension--container': {
-        maxWidth: "".concat(containerWidth - TOTAL_PADDING - tableMarginFullWidthMode * 2, "px")
+        maxWidth: "".concat(containerWidth - getTotalPadding() - tableMarginFullWidthMode * 2, "px")
       },
       '[data-layout-section]': {
-        maxWidth: "".concat(containerWidth - TOTAL_PADDING + akLayoutGutterOffset * 2, "px")
+        maxWidth: "".concat(containerWidth - getTotalPadding() + akLayoutGutterOffset * 2, "px")
       }
     }
   });
@@ -101,7 +104,8 @@ export var editorContentAreaStyle = function editorContentAreaStyle(_ref) {
 };
 var editorContentAreaWithLayoutWith = function editorContentAreaWithLayoutWith(layoutMaxWidth) {
   return css({
-    maxWidth: "".concat(layoutMaxWidth + TOTAL_PADDING, "px")
+    // this restricts max width
+    maxWidth: "".concat(layoutMaxWidth + getTotalPadding(), "px")
   });
 };
 var editorContentArea = css({
@@ -113,7 +117,7 @@ var editorContentArea = css({
   margin: 'auto',
   flexDirection: 'column',
   flexGrow: 1,
-  maxWidth: "".concat(akEditorFullWidthLayoutWidth + TOTAL_PADDING, "px"),
+  maxWidth: "".concat(akEditorFullWidthLayoutWidth + getTotalPadding(), "px"),
   transition: "max-width ".concat(SWOOP_ANIMATION),
   '& .ProseMirror': (_ProseMirror = {
     flexGrow: 1,
@@ -140,5 +144,6 @@ var editorContentArea = css({
 });
 export var editorContentGutterStyle = css({
   boxSizing: 'border-box',
-  padding: "0 ".concat("var(--ds-space-400, 32px)")
+  padding: getBooleanFF('platform.editor.core.increase-full-page-guttering') ? // there is no space token for 52px
+  "0 52px" : "0 ".concat("var(--ds-space-400, 32px)")
 });

package/dist/esm/version-wrapper.js

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