@atlaskit/editor-plugin-layout 1.12.3 → 1.12.5

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/editor-plugin-layout
 
+## 1.12.5
+
+### Patch Changes
+
+- [#165765](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/165765)
+  [`3f441f30e6507`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3f441f30e6507) -
+  Bump adf-schema to 46.0.0
+- [#168790](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/168790)
+  [`e08e221fb797c`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e08e221fb797c) -
+  Add new distributions for 3 column layouts for advanced layouts
+- Updated dependencies
+
+## 1.12.4
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 1.12.3
 
 ### Patch Changes

package/dist/cjs/actions.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.fixColumnStructure = exports.fixColumnSizes = exports.deleteActiveLayoutNode = exports.createMultiColumnLayoutSection = exports.createDefaultLayoutSection = exports.TWO_COL_LAYOUTS = exports.THREE_COL_LAYOUTS = exports.ONE_COL_LAYOUTS = exports.FOUR_COL_LAYOUTS = exports.FIVE_COL_LAYOUTS = void 0;
+exports.fixColumnStructure = exports.fixColumnSizes = exports.deleteActiveLayoutNode = exports.createMultiColumnLayoutSection = exports.createDefaultLayoutSection = exports.TWO_COL_LAYOUTS = exports.THREE_COL_LAYOUTS = exports.ONE_COL_LAYOUTS = void 0;
 exports.forceSectionToPresetLayout = forceSectionToPresetLayout;
 exports.setPresetLayout = exports.insertLayoutColumnsWithAnalytics = exports.insertLayoutColumns = exports.getSelectedLayout = exports.getPresetLayout = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
@@ -23,8 +23,6 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 var ONE_COL_LAYOUTS = exports.ONE_COL_LAYOUTS = ['single'];
 var TWO_COL_LAYOUTS = exports.TWO_COL_LAYOUTS = ['two_equal', 'two_left_sidebar', 'two_right_sidebar'];
 var THREE_COL_LAYOUTS = exports.THREE_COL_LAYOUTS = ['three_equal', 'three_with_sidebars'];
-var FOUR_COL_LAYOUTS = exports.FOUR_COL_LAYOUTS = ['four_equal'];
-var FIVE_COL_LAYOUTS = exports.FIVE_COL_LAYOUTS = ['five_equal'];
 var getWidthsForPreset = function getWidthsForPreset(presetLayout) {
   if ((0, _preRelease.isPreRelease2)()) {
     switch (presetLayout) {
@@ -40,6 +38,10 @@ var getWidthsForPreset = function getWidthsForPreset(presetLayout) {
         return [66.66, 33.33];
       case 'three_with_sidebars':
         return [25, 50, 25];
+      case 'three_left_sidebars':
+        return [25, 25, 50];
+      case 'three_right_sidebars':
+        return [50, 25, 25];
       case 'four_equal':
         return [25, 25, 25, 25];
       case 'five_equal':
@@ -87,6 +89,10 @@ var getPresetLayout = exports.getPresetLayout = function getPresetLayout(section
         return 'three_equal';
       case '25,50,25':
         return 'three_with_sidebars';
+      case '50,25,25':
+        return 'three_right_sidebars';
+      case '25,25,50':
+        return 'three_left_sidebars';
       case '50,50':
         return 'two_equal';
       case '33.33,66.66':

package/dist/cjs/toolbar.js

@@ -25,6 +25,8 @@ var _layoutTwoRightSidebar = _interopRequireDefault(require("@atlaskit/icon/glyp
 var _remove = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/remove"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _actions = require("./actions");
+var _LayoutThreeWithLeftSidebars = require("./ui/icons/LayoutThreeWithLeftSidebars");
+var _LayoutThreeWithRightSidebars = require("./ui/icons/LayoutThreeWithRightSidebars");
 var _preRelease = require("./utils/preRelease");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -67,7 +69,9 @@ var SIDEBAR_LAYOUT_TYPES = [{
   icon: _layoutThreeColumnsSidebars.default,
   iconFallback: _layoutThreeWithSidebars.default
 }];
-var LAYOUT_DISTRIBUTION_TYPES = [{
+
+// These are used for advanced layout options
+var LAYOUT_WITH_TWO_COL_DISTRIBUTION = [{
   id: 'editor.layout.twoEquals',
   type: 'two_equal',
   title: _messages.layoutMessages.twoColumns,
@@ -85,7 +89,8 @@ var LAYOUT_DISTRIBUTION_TYPES = [{
   title: _messages.layoutMessages.leftSidebar,
   icon: _layoutTwoColumnsSidebarLeft.default,
   iconFallback: _layoutTwoLeftSidebar.default
-}, {
+}];
+var LAYOUT_WITH_THREE_COL_DISTRIBUTION = [{
   id: 'editor.layout.threeEquals',
   type: 'three_equal',
   title: _messages.layoutMessages.threeColumns,
@@ -97,13 +102,19 @@ var LAYOUT_DISTRIBUTION_TYPES = [{
   title: _messages.layoutMessages.threeColumnsWithSidebars,
   icon: _layoutThreeColumnsSidebars.default,
   iconFallback: _layoutThreeWithSidebars.default
+}, {
+  id: 'editor.layout.threeRightSidebars',
+  type: 'three_right_sidebars',
+  title: _messages.layoutMessages.threeColumnsWithRightSidebars,
+  icon: _LayoutThreeWithRightSidebars.LayoutThreeWithRightSidebarsIcon,
+  iconFallback: _LayoutThreeWithRightSidebars.LayoutThreeWithRightSidebarsIcon
+}, {
+  id: 'editor.layout.threeLeftSidebars',
+  type: 'three_left_sidebars',
+  title: _messages.layoutMessages.threeColumnsWithLeftSidebars,
+  icon: _LayoutThreeWithLeftSidebars.LayoutThreeWithLeftSidebarsIcon,
+  iconFallback: _LayoutThreeWithLeftSidebars.LayoutThreeWithLeftSidebarsIcon
 }];
-var SIDEBAR_LAYOUT_TYPES_BY_COLUMNS = {
-  2: [LAYOUT_DISTRIBUTION_TYPES[0], LAYOUT_DISTRIBUTION_TYPES[1], LAYOUT_DISTRIBUTION_TYPES[2]],
-  3: [LAYOUT_DISTRIBUTION_TYPES[3], LAYOUT_DISTRIBUTION_TYPES[4]],
-  4: [],
-  5: []
-};
 var buildLayoutButton = function buildLayoutButton(intl, item, currentLayout, editorAnalyticsAPI) {
   return {
     id: item.id,
@@ -119,15 +130,81 @@ var buildLayoutButton = function buildLayoutButton(intl, item, currentLayout, ed
 };
 var layoutToolbarTitle = exports.layoutToolbarTitle = 'Layout floating controls';
 var iconPlaceholder = _layoutTwoColumns.default; // TODO: Replace with proper icon ED-25466
+
+var getAdvancedLayoutItems = function getAdvancedLayoutItems(_ref) {
+  var addSidebarLayouts = _ref.addSidebarLayouts,
+    intl = _ref.intl,
+    editorAnalyticsAPI = _ref.editorAnalyticsAPI,
+    state = _ref.state,
+    node = _ref.node,
+    nodeType = _ref.nodeType,
+    separator = _ref.separator,
+    deleteButton = _ref.deleteButton,
+    currentLayout = _ref.currentLayout;
+  var numberOfColumns = node.content.childCount || 2;
+  var distributionOptions = numberOfColumns === 2 ? LAYOUT_WITH_TWO_COL_DISTRIBUTION : numberOfColumns === 3 ? LAYOUT_WITH_THREE_COL_DISTRIBUTION : [];
+  var columnOptions = [{
+    title: intl.formatMessage(_messages.layoutMessages.columnOption, {
+      count: 2
+    }),
+    //'2-columns',
+    icon: iconPlaceholder,
+    onClick: (0, _actions.setPresetLayout)(editorAnalyticsAPI)('two_equal', intl.formatMessage),
+    selected: numberOfColumns === 2
+  }, {
+    title: intl.formatMessage(_messages.layoutMessages.columnOption, {
+      count: 3
+    }),
+    //'3-columns'
+    icon: iconPlaceholder,
+    onClick: (0, _actions.setPresetLayout)(editorAnalyticsAPI)('three_equal', intl.formatMessage),
+    selected: numberOfColumns === 3
+  }, {
+    title: intl.formatMessage(_messages.layoutMessages.columnOption, {
+      count: 4
+    }),
+    //'4-columns'
+    icon: iconPlaceholder,
+    onClick: (0, _actions.setPresetLayout)(editorAnalyticsAPI)('four_equal', intl.formatMessage),
+    selected: numberOfColumns === 4
+  }, {
+    title: intl.formatMessage(_messages.layoutMessages.columnOption, {
+      count: 5
+    }),
+    //'5-columns'
+    icon: iconPlaceholder,
+    onClick: (0, _actions.setPresetLayout)(editorAnalyticsAPI)('five_equal', intl.formatMessage),
+    selected: numberOfColumns === 5
+  }];
+  return [{
+    type: 'dropdown',
+    title: intl.formatMessage(_messages.layoutMessages.columnOption, {
+      count: numberOfColumns
+    }),
+    //`${numberOfColumns}-columns`,
+    options: columnOptions,
+    showSelected: true,
+    testId: 'column-options-button'
+  }].concat((0, _toConsumableArray2.default)(distributionOptions.length > 0 ? [separator] : []), (0, _toConsumableArray2.default)(addSidebarLayouts ? distributionOptions.map(function (i) {
+    return buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI);
+  }) : []), [separator, {
+    type: 'copy-button',
+    supportsViewMode: !(0, _platformFeatureFlags.fg)('platform_editor_remove_copy_button_from_view_mode'),
+    items: [{
+      state: state,
+      formatMessage: intl.formatMessage,
+      nodeType: nodeType
+    }]
+  }, separator, deleteButton]);
+};
 var buildToolbar = exports.buildToolbar = function buildToolbar(state, intl, pos, _allowBreakout, addSidebarLayouts, allowSingleColumnLayout, api) {
   var _api$decorations$acti, _api$decorations, _api$analytics;
-  var _ref = (_api$decorations$acti = api === null || api === void 0 || (_api$decorations = api.decorations) === null || _api$decorations === void 0 ? void 0 : _api$decorations.actions) !== null && _api$decorations$acti !== void 0 ? _api$decorations$acti : {},
-    hoverDecoration = _ref.hoverDecoration;
+  var _ref2 = (_api$decorations$acti = api === null || api === void 0 || (_api$decorations = api.decorations) === null || _api$decorations === void 0 ? void 0 : _api$decorations.actions) !== null && _api$decorations$acti !== void 0 ? _api$decorations$acti : {},
+    hoverDecoration = _ref2.hoverDecoration;
   var editorAnalyticsAPI = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
   var node = state.doc.nodeAt(pos);
   if (node) {
     var currentLayout = (0, _actions.getPresetLayout)(node);
-    var numberOfColumns = node.content.childCount || 2;
     var separator = {
       type: 'separator'
     };
@@ -148,41 +225,7 @@ var buildToolbar = exports.buildToolbar = function buildToolbar(state, intl, pos
       onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false),
       tabIndex: null
     };
-    var layoutTypes = (0, _preRelease.isPreRelease2)() ? [] : allowSingleColumnLayout ? LAYOUT_TYPES_WITH_SINGLE_COL : LAYOUT_TYPES;
-    var columnOptions = [{
-      title: intl.formatMessage(_messages.layoutMessages.columnOption, {
-        count: 2
-      }),
-      //'2-columns',
-      icon: iconPlaceholder,
-      onClick: (0, _actions.setPresetLayout)(editorAnalyticsAPI)('two_equal', intl.formatMessage),
-      selected: numberOfColumns === 2
-    }, {
-      title: intl.formatMessage(_messages.layoutMessages.columnOption, {
-        count: 3
-      }),
-      //'3-columns'
-      icon: iconPlaceholder,
-      onClick: (0, _actions.setPresetLayout)(editorAnalyticsAPI)('three_equal', intl.formatMessage),
-      selected: numberOfColumns === 3
-    }, {
-      title: intl.formatMessage(_messages.layoutMessages.columnOption, {
-        count: 4
-      }),
-      //'4-columns'
-      icon: iconPlaceholder,
-      onClick: (0, _actions.setPresetLayout)(editorAnalyticsAPI)('four_equal', intl.formatMessage),
-      selected: numberOfColumns === 4
-    }, {
-      title: intl.formatMessage(_messages.layoutMessages.columnOption, {
-        count: 5
-      }),
-      //'5-columns'
-      icon: iconPlaceholder,
-      onClick: (0, _actions.setPresetLayout)(editorAnalyticsAPI)('five_equal', intl.formatMessage),
-      selected: numberOfColumns === 5
-    }];
-    var sidebarTypesByColumns = SIDEBAR_LAYOUT_TYPES_BY_COLUMNS[numberOfColumns] || [];
+    var layoutTypes = allowSingleColumnLayout ? LAYOUT_TYPES_WITH_SINGLE_COL : LAYOUT_TYPES;
     return {
       title: layoutToolbarTitle,
       getDomRef: function getDomRef(view) {
@@ -190,20 +233,19 @@ var buildToolbar = exports.buildToolbar = function buildToolbar(state, intl, pos
       },
       nodeType: nodeType,
       groupLabel: intl.formatMessage(_messages.layoutMessages.floatingToolbarRadioGroupAriaLabel),
-      items: [].concat((0, _toConsumableArray2.default)((0, _preRelease.isPreRelease2)() ? [{
-        type: 'dropdown',
-        title: intl.formatMessage(_messages.layoutMessages.columnOption, {
-          count: numberOfColumns
-        }),
-        //`${numberOfColumns}-columns`,
-        options: columnOptions,
-        showSelected: true,
-        testId: 'column-options-button'
-      }].concat((0, _toConsumableArray2.default)(sidebarTypesByColumns.length > 0 ? [separator] : [])) : []), (0, _toConsumableArray2.default)(layoutTypes.map(function (i) {
-        return buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI);
-      })), (0, _toConsumableArray2.default)(addSidebarLayouts ? (0, _preRelease.isPreRelease2)() ? sidebarTypesByColumns.map(function (i) {
+      items: (0, _preRelease.isPreRelease2)() ? getAdvancedLayoutItems({
+        addSidebarLayouts: addSidebarLayouts,
+        intl: intl,
+        editorAnalyticsAPI: editorAnalyticsAPI,
+        state: state,
+        nodeType: nodeType,
+        node: node,
+        separator: separator,
+        deleteButton: deleteButton,
+        currentLayout: currentLayout
+      }) : [].concat((0, _toConsumableArray2.default)(layoutTypes.map(function (i) {
         return buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI);
-      }) : SIDEBAR_LAYOUT_TYPES.map(function (i) {
+      })), (0, _toConsumableArray2.default)(addSidebarLayouts ? SIDEBAR_LAYOUT_TYPES.map(function (i) {
         return buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI);
       }) : []), [separator, {
         type: 'copy-button',

package/dist/cjs/ui/icons/LayoutThreeWithLeftSidebars.js

@@ -0,0 +1,56 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LayoutThreeWithLeftSidebarsIcon = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = require("@emotion/react");
+var _icon = _interopRequireDefault(require("@atlaskit/icon"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+
+var LayoutThreeWithLeftSidebarsGlyph = function LayoutThreeWithLeftSidebarsGlyph(props) {
+  if ((0, _platformFeatureFlags.fg)('platform-visual-refresh-icons')) {
+    return (0, _react.jsx)("svg", (0, _extends2.default)({
+      width: "16",
+      height: "14",
+      viewBox: "0 0 16 14",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg"
+    }, props), (0, _react.jsx)("path", {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M7.5 1.375C7.5 0.615609 8.11561 0 8.875 0H9.625C10.3844 0 11 0.615608 11 1.375V12.625C11 13.3844 10.3844 14 9.625 14H8.875C8.11561 14 7.5 13.3844 7.5 12.625V1.375ZM9 1.5V12.5H9.5V1.5H9ZM0 1.37505C0 0.615655 0.615608 4.66853e-05 1.375 4.66853e-05H4.625C5.38439 4.66853e-05 6 0.615655 6 1.37505V12.625C6 13.3844 5.38439 14 4.625 14H1.375C0.615608 14 0 13.3844 0 12.625V1.37505ZM1.5 1.50005V12.5H4.5V1.50005H1.5ZM12.5 1.37505C12.5 0.615655 13.1156 4.66853e-05 13.875 4.66853e-05H14.625C15.3844 4.66853e-05 16 0.615655 16 1.37505V12.625C16 13.3844 15.3844 14 14.625 14H13.875C13.1156 14 12.5 13.3844 12.5 12.625V1.37505ZM14 1.50005V12.5H14.5V1.50005H14Z",
+      fill: "currentcolor"
+    }));
+  }
+  return (0, _react.jsx)("svg", (0, _extends2.default)({
+    width: "16",
+    height: "14",
+    viewBox: "0 0 16 14",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), (0, _react.jsx)("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M1 0C1.26522 0 1.51957 0.105357 1.70711 0.292893C1.89464 0.48043 2 0.734784 2 1V13C2 13.2652 1.89464 13.5196 1.70711 13.7071C1.51957 13.8946 1.26522 14 1 14C0.734784 14 0.48043 13.8946 0.292893 13.7071C0.105357 13.5196 0 13.2652 0 13V1C0 0.734784 0.105357 0.48043 0.292893 0.292893C0.48043 0.105357 0.734784 0 1 0ZM9 0H15C15.2652 0 15.5196 0.105357 15.7071 0.292893C15.8946 0.48043 16 0.734784 16 1V13C16 13.2652 15.8946 13.5196 15.7071 13.7071C15.5196 13.8946 15.2652 14 15 14H9C8.73478 14 8.48043 13.8946 8.29289 13.7071C8.10536 13.5196 8 13.2652 8 13V1C8 0.734784 8.10536 0.48043 8.29289 0.292893C8.48043 0.105357 8.73478 0 9 0ZM5 0C5.26522 0 5.51957 0.105356 5.70711 0.292892C5.89464 0.480429 6 0.734784 6 1V13C6 13.2652 5.89464 13.5196 5.70711 13.7071C5.51957 13.8946 5.26522 14 5 14C4.73478 14 4.48043 13.8946 4.29289 13.7071C4.10536 13.5196 4 13.2652 4 13V1C4 0.734784 4.10536 0.480429 4.29289 0.292892C4.48043 0.105356 4.73478 0 5 0Z",
+    fill: "currentcolor"
+  }));
+};
+var floatingToolbarPadding = (0, _react.css)({
+  paddingRight: "var(--ds-space-050, 4px)",
+  paddingLeft: "var(--ds-space-050, 4px)"
+});
+var LayoutThreeWithLeftSidebarsIcon = exports.LayoutThreeWithLeftSidebarsIcon = function LayoutThreeWithLeftSidebarsIcon(props) {
+  return (0, _react.jsx)("span", {
+    css: floatingToolbarPadding
+  }, (0, _react.jsx)(_icon.default, (0, _extends2.default)({
+    glyph: LayoutThreeWithLeftSidebarsGlyph
+  }, props)));
+};

package/dist/cjs/ui/icons/LayoutThreeWithRightSidebars.js

@@ -0,0 +1,56 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LayoutThreeWithRightSidebarsIcon = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = require("@emotion/react");
+var _icon = _interopRequireDefault(require("@atlaskit/icon"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+
+var LayoutThreeWithRightSidebarsGlyph = function LayoutThreeWithRightSidebarsGlyph(props) {
+  if ((0, _platformFeatureFlags.fg)('platform-visual-refresh-icons')) {
+    return (0, _react.jsx)("svg", (0, _extends2.default)({
+      width: "16",
+      height: "14",
+      viewBox: "0 0 16 14",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg"
+    }, props), (0, _react.jsx)("path", {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M8.5 1.375C8.5 0.615609 7.88439 0 7.125 0H6.375C5.61561 0 5 0.615608 5 1.375V12.625C5 13.3844 5.61561 14 6.375 14H7.125C7.88439 14 8.5 13.3844 8.5 12.625V1.375ZM7 1.5V12.5H6.5V1.5H7ZM16 1.37505C16 0.615655 15.3844 4.66853e-05 14.625 4.66853e-05H11.375C10.6156 4.66853e-05 10 0.615655 10 1.37505V12.625C10 13.3844 10.6156 14 11.375 14H14.625C15.3844 14 16 13.3844 16 12.625V1.37505ZM14.5 1.50005V12.5H11.5V1.50005H14.5ZM3.5 1.37505C3.5 0.615655 2.88439 4.66853e-05 2.125 4.66853e-05H1.375C0.615608 4.66853e-05 0 0.615655 0 1.37505V12.625C0 13.3844 0.615608 14 1.375 14H2.125C2.88439 14 3.5 13.3844 3.5 12.625V1.37505ZM2 1.50005V12.5H1.5V1.50005H2Z",
+      fill: "currentcolor"
+    }));
+  }
+  return (0, _react.jsx)("svg", (0, _extends2.default)({
+    width: "16",
+    height: "14",
+    viewBox: "0 0 16 14",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), (0, _react.jsx)("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M11 0C11.2652 0 11.5196 0.105357 11.7071 0.292893C11.8946 0.48043 12 0.734784 12 1V13C12 13.2652 11.8946 13.5196 11.7071 13.7071C11.5196 13.8946 11.2652 14 11 14C10.7348 14 10.4804 13.8946 10.2929 13.7071C10.1054 13.5196 10 13.2652 10 13V1C10 0.734784 10.1054 0.48043 10.2929 0.292893C10.4804 0.105357 10.7348 0 11 0ZM1 0H7C7.26522 0 7.51957 0.105357 7.70711 0.292893C7.89464 0.48043 8 0.734784 8 1V13C8 13.2652 7.89464 13.5196 7.70711 13.7071C7.51957 13.8946 7.26522 14 7 14H1C0.734784 14 0.48043 13.8946 0.292893 13.7071C0.105357 13.5196 0 13.2652 0 13V1C0 0.734784 0.105357 0.48043 0.292893 0.292893C0.48043 0.105357 0.734784 0 1 0ZM15 0C15.2652 0 15.5196 0.105357 15.7071 0.292893C15.8946 0.48043 16 0.734784 16 1V13C16 13.2652 15.8946 13.5196 15.7071 13.7071C15.5196 13.8946 15.2652 14 15 14C14.7348 14 14.4804 13.8946 14.2929 13.7071C14.1054 13.5196 14 13.2652 14 13V1C14 0.734784 14.1054 0.48043 14.2929 0.292893C14.4804 0.105357 14.7348 0 15 0Z",
+    fill: "currentcolor"
+  }));
+};
+var floatingToolbarPadding = (0, _react.css)({
+  paddingRight: "var(--ds-space-050, 4px)",
+  paddingLeft: "var(--ds-space-050, 4px)"
+});
+var LayoutThreeWithRightSidebarsIcon = exports.LayoutThreeWithRightSidebarsIcon = function LayoutThreeWithRightSidebarsIcon(props) {
+  return (0, _react.jsx)("span", {
+    css: floatingToolbarPadding
+  }, (0, _react.jsx)(_icon.default, (0, _extends2.default)({
+    glyph: LayoutThreeWithRightSidebarsGlyph
+  }, props)));
+};

package/dist/es2019/actions.js

@@ -11,8 +11,6 @@ import { isPreRelease2 } from './utils/preRelease';
 export const ONE_COL_LAYOUTS = ['single'];
 export const TWO_COL_LAYOUTS = ['two_equal', 'two_left_sidebar', 'two_right_sidebar'];
 export const THREE_COL_LAYOUTS = ['three_equal', 'three_with_sidebars'];
-export const FOUR_COL_LAYOUTS = ['four_equal'];
-export const FIVE_COL_LAYOUTS = ['five_equal'];
 const getWidthsForPreset = presetLayout => {
   if (isPreRelease2()) {
     switch (presetLayout) {
@@ -28,6 +26,10 @@ const getWidthsForPreset = presetLayout => {
         return [66.66, 33.33];
       case 'three_with_sidebars':
         return [25, 50, 25];
+      case 'three_left_sidebars':
+        return [25, 25, 50];
+      case 'three_right_sidebars':
+        return [50, 25, 25];
       case 'four_equal':
         return [25, 25, 25, 25];
       case 'five_equal':
@@ -71,6 +73,10 @@ export const getPresetLayout = section => {
         return 'three_equal';
       case '25,50,25':
         return 'three_with_sidebars';
+      case '50,25,25':
+        return 'three_right_sidebars';
+      case '25,25,50':
+        return 'three_left_sidebars';
       case '50,50':
         return 'two_equal';
       case '33.33,66.66':

package/dist/es2019/toolbar.js

@@ -16,6 +16,8 @@ import LayoutTwoRightSidebarIcon from '@atlaskit/icon/glyph/editor/layout-two-ri
 import RemoveIcon from '@atlaskit/icon/glyph/editor/remove';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { deleteActiveLayoutNode, getPresetLayout, setPresetLayout } from './actions';
+import { LayoutThreeWithLeftSidebarsIcon } from './ui/icons/LayoutThreeWithLeftSidebars';
+import { LayoutThreeWithRightSidebarsIcon } from './ui/icons/LayoutThreeWithRightSidebars';
 import { isPreRelease2 } from './utils/preRelease';
 const LAYOUT_TYPES = [{
   id: 'editor.layout.twoEquals',
@@ -56,7 +58,9 @@ const SIDEBAR_LAYOUT_TYPES = [{
   icon: LayoutThreeColumnsSidebarsIcon,
   iconFallback: LayoutThreeWithSidebarsIcon
 }];
-const LAYOUT_DISTRIBUTION_TYPES = [{
+
+// These are used for advanced layout options
+const LAYOUT_WITH_TWO_COL_DISTRIBUTION = [{
   id: 'editor.layout.twoEquals',
   type: 'two_equal',
   title: toolbarMessages.twoColumns,
@@ -74,7 +78,8 @@ const LAYOUT_DISTRIBUTION_TYPES = [{
   title: toolbarMessages.leftSidebar,
   icon: LayoutTwoColumnsSidebarLeftIcon,
   iconFallback: LayoutTwoLeftSidebarIcon
-}, {
+}];
+const LAYOUT_WITH_THREE_COL_DISTRIBUTION = [{
   id: 'editor.layout.threeEquals',
   type: 'three_equal',
   title: toolbarMessages.threeColumns,
@@ -86,13 +91,19 @@ const LAYOUT_DISTRIBUTION_TYPES = [{
   title: toolbarMessages.threeColumnsWithSidebars,
   icon: LayoutThreeColumnsSidebarsIcon,
   iconFallback: LayoutThreeWithSidebarsIcon
+}, {
+  id: 'editor.layout.threeRightSidebars',
+  type: 'three_right_sidebars',
+  title: toolbarMessages.threeColumnsWithRightSidebars,
+  icon: LayoutThreeWithRightSidebarsIcon,
+  iconFallback: LayoutThreeWithRightSidebarsIcon
+}, {
+  id: 'editor.layout.threeLeftSidebars',
+  type: 'three_left_sidebars',
+  title: toolbarMessages.threeColumnsWithLeftSidebars,
+  icon: LayoutThreeWithLeftSidebarsIcon,
+  iconFallback: LayoutThreeWithLeftSidebarsIcon
 }];
-const SIDEBAR_LAYOUT_TYPES_BY_COLUMNS = {
-  2: [LAYOUT_DISTRIBUTION_TYPES[0], LAYOUT_DISTRIBUTION_TYPES[1], LAYOUT_DISTRIBUTION_TYPES[2]],
-  3: [LAYOUT_DISTRIBUTION_TYPES[3], LAYOUT_DISTRIBUTION_TYPES[4]],
-  4: [],
-  5: []
-};
 const buildLayoutButton = (intl, item, currentLayout, editorAnalyticsAPI) => ({
   id: item.id,
   type: 'button',
@@ -106,6 +117,72 @@ const buildLayoutButton = (intl, item, currentLayout, editorAnalyticsAPI) => ({
 });
 export const layoutToolbarTitle = 'Layout floating controls';
 const iconPlaceholder = LayoutTwoColumnsIcon; // TODO: Replace with proper icon ED-25466
+
+const getAdvancedLayoutItems = ({
+  addSidebarLayouts,
+  intl,
+  editorAnalyticsAPI,
+  state,
+  node,
+  nodeType,
+  separator,
+  deleteButton,
+  currentLayout
+}) => {
+  const numberOfColumns = node.content.childCount || 2;
+  const distributionOptions = numberOfColumns === 2 ? LAYOUT_WITH_TWO_COL_DISTRIBUTION : numberOfColumns === 3 ? LAYOUT_WITH_THREE_COL_DISTRIBUTION : [];
+  const columnOptions = [{
+    title: intl.formatMessage(layoutMessages.columnOption, {
+      count: 2
+    }),
+    //'2-columns',
+    icon: iconPlaceholder,
+    onClick: setPresetLayout(editorAnalyticsAPI)('two_equal', intl.formatMessage),
+    selected: numberOfColumns === 2
+  }, {
+    title: intl.formatMessage(layoutMessages.columnOption, {
+      count: 3
+    }),
+    //'3-columns'
+    icon: iconPlaceholder,
+    onClick: setPresetLayout(editorAnalyticsAPI)('three_equal', intl.formatMessage),
+    selected: numberOfColumns === 3
+  }, {
+    title: intl.formatMessage(layoutMessages.columnOption, {
+      count: 4
+    }),
+    //'4-columns'
+    icon: iconPlaceholder,
+    onClick: setPresetLayout(editorAnalyticsAPI)('four_equal', intl.formatMessage),
+    selected: numberOfColumns === 4
+  }, {
+    title: intl.formatMessage(layoutMessages.columnOption, {
+      count: 5
+    }),
+    //'5-columns'
+    icon: iconPlaceholder,
+    onClick: setPresetLayout(editorAnalyticsAPI)('five_equal', intl.formatMessage),
+    selected: numberOfColumns === 5
+  }];
+  return [{
+    type: 'dropdown',
+    title: intl.formatMessage(layoutMessages.columnOption, {
+      count: numberOfColumns
+    }),
+    //`${numberOfColumns}-columns`,
+    options: columnOptions,
+    showSelected: true,
+    testId: 'column-options-button'
+  }, ...(distributionOptions.length > 0 ? [separator] : []), ...(addSidebarLayouts ? distributionOptions.map(i => buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI)) : []), separator, {
+    type: 'copy-button',
+    supportsViewMode: !fg('platform_editor_remove_copy_button_from_view_mode'),
+    items: [{
+      state,
+      formatMessage: intl.formatMessage,
+      nodeType
+    }]
+  }, separator, deleteButton];
+};
 export const buildToolbar = (state, intl, pos, _allowBreakout, addSidebarLayouts, allowSingleColumnLayout, api) => {
   var _api$decorations$acti, _api$decorations, _api$analytics;
   const {
@@ -115,7 +192,6 @@ export const buildToolbar = (state, intl, pos, _allowBreakout, addSidebarLayouts
   const node = state.doc.nodeAt(pos);
   if (node) {
     const currentLayout = getPresetLayout(node);
-    const numberOfColumns = node.content.childCount || 2;
     const separator = {
       type: 'separator'
     };
@@ -136,56 +212,23 @@ export const buildToolbar = (state, intl, pos, _allowBreakout, addSidebarLayouts
       onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false),
       tabIndex: null
     };
-    const layoutTypes = isPreRelease2() ? [] : allowSingleColumnLayout ? LAYOUT_TYPES_WITH_SINGLE_COL : LAYOUT_TYPES;
-    const columnOptions = [{
-      title: intl.formatMessage(layoutMessages.columnOption, {
-        count: 2
-      }),
-      //'2-columns',
-      icon: iconPlaceholder,
-      onClick: setPresetLayout(editorAnalyticsAPI)('two_equal', intl.formatMessage),
-      selected: numberOfColumns === 2
-    }, {
-      title: intl.formatMessage(layoutMessages.columnOption, {
-        count: 3
-      }),
-      //'3-columns'
-      icon: iconPlaceholder,
-      onClick: setPresetLayout(editorAnalyticsAPI)('three_equal', intl.formatMessage),
-      selected: numberOfColumns === 3
-    }, {
-      title: intl.formatMessage(layoutMessages.columnOption, {
-        count: 4
-      }),
-      //'4-columns'
-      icon: iconPlaceholder,
-      onClick: setPresetLayout(editorAnalyticsAPI)('four_equal', intl.formatMessage),
-      selected: numberOfColumns === 4
-    }, {
-      title: intl.formatMessage(layoutMessages.columnOption, {
-        count: 5
-      }),
-      //'5-columns'
-      icon: iconPlaceholder,
-      onClick: setPresetLayout(editorAnalyticsAPI)('five_equal', intl.formatMessage),
-      selected: numberOfColumns === 5
-    }];
-    const sidebarTypesByColumns = SIDEBAR_LAYOUT_TYPES_BY_COLUMNS[numberOfColumns] || [];
+    const layoutTypes = allowSingleColumnLayout ? LAYOUT_TYPES_WITH_SINGLE_COL : LAYOUT_TYPES;
     return {
       title: layoutToolbarTitle,
       getDomRef: view => findDomRefAtPos(pos, view.domAtPos.bind(view)),
       nodeType,
       groupLabel: intl.formatMessage(toolbarMessages.floatingToolbarRadioGroupAriaLabel),
-      items: [...(isPreRelease2() ? [{
-        type: 'dropdown',
-        title: intl.formatMessage(layoutMessages.columnOption, {
-          count: numberOfColumns
-        }),
-        //`${numberOfColumns}-columns`,
-        options: columnOptions,
-        showSelected: true,
-        testId: 'column-options-button'
-      }, ...(sidebarTypesByColumns.length > 0 ? [separator] : [])] : []), ...layoutTypes.map(i => buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI)), ...(addSidebarLayouts ? isPreRelease2() ? sidebarTypesByColumns.map(i => buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI)) : SIDEBAR_LAYOUT_TYPES.map(i => buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI)) : []), separator, {
+      items: isPreRelease2() ? getAdvancedLayoutItems({
+        addSidebarLayouts,
+        intl,
+        editorAnalyticsAPI,
+        state,
+        nodeType,
+        node,
+        separator,
+        deleteButton,
+        currentLayout
+      }) : [...layoutTypes.map(i => buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI)), ...(addSidebarLayouts ? SIDEBAR_LAYOUT_TYPES.map(i => buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI)) : []), separator, {
         type: 'copy-button',
         supportsViewMode: !fg('platform_editor_remove_copy_button_from_view_mode'),
         items: [{

package/dist/es2019/ui/icons/LayoutThreeWithLeftSidebars.js

@@ -0,0 +1,46 @@
+import _extends from "@babel/runtime/helpers/extends";
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css, jsx } from '@emotion/react';
+import Icon from '@atlaskit/icon';
+import { fg } from '@atlaskit/platform-feature-flags';
+const LayoutThreeWithLeftSidebarsGlyph = props => {
+  if (fg('platform-visual-refresh-icons')) {
+    return jsx("svg", _extends({
+      width: "16",
+      height: "14",
+      viewBox: "0 0 16 14",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg"
+    }, props), jsx("path", {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M7.5 1.375C7.5 0.615609 8.11561 0 8.875 0H9.625C10.3844 0 11 0.615608 11 1.375V12.625C11 13.3844 10.3844 14 9.625 14H8.875C8.11561 14 7.5 13.3844 7.5 12.625V1.375ZM9 1.5V12.5H9.5V1.5H9ZM0 1.37505C0 0.615655 0.615608 4.66853e-05 1.375 4.66853e-05H4.625C5.38439 4.66853e-05 6 0.615655 6 1.37505V12.625C6 13.3844 5.38439 14 4.625 14H1.375C0.615608 14 0 13.3844 0 12.625V1.37505ZM1.5 1.50005V12.5H4.5V1.50005H1.5ZM12.5 1.37505C12.5 0.615655 13.1156 4.66853e-05 13.875 4.66853e-05H14.625C15.3844 4.66853e-05 16 0.615655 16 1.37505V12.625C16 13.3844 15.3844 14 14.625 14H13.875C13.1156 14 12.5 13.3844 12.5 12.625V1.37505ZM14 1.50005V12.5H14.5V1.50005H14Z",
+      fill: "currentcolor"
+    }));
+  }
+  return jsx("svg", _extends({
+    width: "16",
+    height: "14",
+    viewBox: "0 0 16 14",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), jsx("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M1 0C1.26522 0 1.51957 0.105357 1.70711 0.292893C1.89464 0.48043 2 0.734784 2 1V13C2 13.2652 1.89464 13.5196 1.70711 13.7071C1.51957 13.8946 1.26522 14 1 14C0.734784 14 0.48043 13.8946 0.292893 13.7071C0.105357 13.5196 0 13.2652 0 13V1C0 0.734784 0.105357 0.48043 0.292893 0.292893C0.48043 0.105357 0.734784 0 1 0ZM9 0H15C15.2652 0 15.5196 0.105357 15.7071 0.292893C15.8946 0.48043 16 0.734784 16 1V13C16 13.2652 15.8946 13.5196 15.7071 13.7071C15.5196 13.8946 15.2652 14 15 14H9C8.73478 14 8.48043 13.8946 8.29289 13.7071C8.10536 13.5196 8 13.2652 8 13V1C8 0.734784 8.10536 0.48043 8.29289 0.292893C8.48043 0.105357 8.73478 0 9 0ZM5 0C5.26522 0 5.51957 0.105356 5.70711 0.292892C5.89464 0.480429 6 0.734784 6 1V13C6 13.2652 5.89464 13.5196 5.70711 13.7071C5.51957 13.8946 5.26522 14 5 14C4.73478 14 4.48043 13.8946 4.29289 13.7071C4.10536 13.5196 4 13.2652 4 13V1C4 0.734784 4.10536 0.480429 4.29289 0.292892C4.48043 0.105356 4.73478 0 5 0Z",
+    fill: "currentcolor"
+  }));
+};
+const floatingToolbarPadding = css({
+  paddingRight: "var(--ds-space-050, 4px)",
+  paddingLeft: "var(--ds-space-050, 4px)"
+});
+export const LayoutThreeWithLeftSidebarsIcon = props => jsx("span", {
+  css: floatingToolbarPadding
+}, jsx(Icon, _extends({
+  glyph: LayoutThreeWithLeftSidebarsGlyph
+}, props)));

package/dist/es2019/ui/icons/LayoutThreeWithRightSidebars.js

@@ -0,0 +1,46 @@
+import _extends from "@babel/runtime/helpers/extends";
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css, jsx } from '@emotion/react';
+import Icon from '@atlaskit/icon';
+import { fg } from '@atlaskit/platform-feature-flags';
+const LayoutThreeWithRightSidebarsGlyph = props => {
+  if (fg('platform-visual-refresh-icons')) {
+    return jsx("svg", _extends({
+      width: "16",
+      height: "14",
+      viewBox: "0 0 16 14",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg"
+    }, props), jsx("path", {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M8.5 1.375C8.5 0.615609 7.88439 0 7.125 0H6.375C5.61561 0 5 0.615608 5 1.375V12.625C5 13.3844 5.61561 14 6.375 14H7.125C7.88439 14 8.5 13.3844 8.5 12.625V1.375ZM7 1.5V12.5H6.5V1.5H7ZM16 1.37505C16 0.615655 15.3844 4.66853e-05 14.625 4.66853e-05H11.375C10.6156 4.66853e-05 10 0.615655 10 1.37505V12.625C10 13.3844 10.6156 14 11.375 14H14.625C15.3844 14 16 13.3844 16 12.625V1.37505ZM14.5 1.50005V12.5H11.5V1.50005H14.5ZM3.5 1.37505C3.5 0.615655 2.88439 4.66853e-05 2.125 4.66853e-05H1.375C0.615608 4.66853e-05 0 0.615655 0 1.37505V12.625C0 13.3844 0.615608 14 1.375 14H2.125C2.88439 14 3.5 13.3844 3.5 12.625V1.37505ZM2 1.50005V12.5H1.5V1.50005H2Z",
+      fill: "currentcolor"
+    }));
+  }
+  return jsx("svg", _extends({
+    width: "16",
+    height: "14",
+    viewBox: "0 0 16 14",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), jsx("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M11 0C11.2652 0 11.5196 0.105357 11.7071 0.292893C11.8946 0.48043 12 0.734784 12 1V13C12 13.2652 11.8946 13.5196 11.7071 13.7071C11.5196 13.8946 11.2652 14 11 14C10.7348 14 10.4804 13.8946 10.2929 13.7071C10.1054 13.5196 10 13.2652 10 13V1C10 0.734784 10.1054 0.48043 10.2929 0.292893C10.4804 0.105357 10.7348 0 11 0ZM1 0H7C7.26522 0 7.51957 0.105357 7.70711 0.292893C7.89464 0.48043 8 0.734784 8 1V13C8 13.2652 7.89464 13.5196 7.70711 13.7071C7.51957 13.8946 7.26522 14 7 14H1C0.734784 14 0.48043 13.8946 0.292893 13.7071C0.105357 13.5196 0 13.2652 0 13V1C0 0.734784 0.105357 0.48043 0.292893 0.292893C0.48043 0.105357 0.734784 0 1 0ZM15 0C15.2652 0 15.5196 0.105357 15.7071 0.292893C15.8946 0.48043 16 0.734784 16 1V13C16 13.2652 15.8946 13.5196 15.7071 13.7071C15.5196 13.8946 15.2652 14 15 14C14.7348 14 14.4804 13.8946 14.2929 13.7071C14.1054 13.5196 14 13.2652 14 13V1C14 0.734784 14.1054 0.48043 14.2929 0.292893C14.4804 0.105357 14.7348 0 15 0Z",
+    fill: "currentcolor"
+  }));
+};
+const floatingToolbarPadding = css({
+  paddingRight: "var(--ds-space-050, 4px)",
+  paddingLeft: "var(--ds-space-050, 4px)"
+});
+export const LayoutThreeWithRightSidebarsIcon = props => jsx("span", {
+  css: floatingToolbarPadding
+}, jsx(Icon, _extends({
+  glyph: LayoutThreeWithRightSidebarsGlyph
+}, props)));

package/dist/esm/actions.js

@@ -14,8 +14,6 @@ import { isPreRelease2 } from './utils/preRelease';
 export var ONE_COL_LAYOUTS = ['single'];
 export var TWO_COL_LAYOUTS = ['two_equal', 'two_left_sidebar', 'two_right_sidebar'];
 export var THREE_COL_LAYOUTS = ['three_equal', 'three_with_sidebars'];
-export var FOUR_COL_LAYOUTS = ['four_equal'];
-export var FIVE_COL_LAYOUTS = ['five_equal'];
 var getWidthsForPreset = function getWidthsForPreset(presetLayout) {
   if (isPreRelease2()) {
     switch (presetLayout) {
@@ -31,6 +29,10 @@ var getWidthsForPreset = function getWidthsForPreset(presetLayout) {
         return [66.66, 33.33];
       case 'three_with_sidebars':
         return [25, 50, 25];
+      case 'three_left_sidebars':
+        return [25, 25, 50];
+      case 'three_right_sidebars':
+        return [50, 25, 25];
       case 'four_equal':
         return [25, 25, 25, 25];
       case 'five_equal':
@@ -78,6 +80,10 @@ export var getPresetLayout = function getPresetLayout(section) {
         return 'three_equal';
       case '25,50,25':
         return 'three_with_sidebars';
+      case '50,25,25':
+        return 'three_right_sidebars';
+      case '25,25,50':
+        return 'three_left_sidebars';
       case '50,50':
         return 'two_equal';
       case '33.33,66.66':

package/dist/esm/toolbar.js

@@ -17,6 +17,8 @@ import LayoutTwoRightSidebarIcon from '@atlaskit/icon/glyph/editor/layout-two-ri
 import RemoveIcon from '@atlaskit/icon/glyph/editor/remove';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { deleteActiveLayoutNode, getPresetLayout, setPresetLayout } from './actions';
+import { LayoutThreeWithLeftSidebarsIcon } from './ui/icons/LayoutThreeWithLeftSidebars';
+import { LayoutThreeWithRightSidebarsIcon } from './ui/icons/LayoutThreeWithRightSidebars';
 import { isPreRelease2 } from './utils/preRelease';
 var LAYOUT_TYPES = [{
   id: 'editor.layout.twoEquals',
@@ -57,7 +59,9 @@ var SIDEBAR_LAYOUT_TYPES = [{
   icon: LayoutThreeColumnsSidebarsIcon,
   iconFallback: LayoutThreeWithSidebarsIcon
 }];
-var LAYOUT_DISTRIBUTION_TYPES = [{
+
+// These are used for advanced layout options
+var LAYOUT_WITH_TWO_COL_DISTRIBUTION = [{
   id: 'editor.layout.twoEquals',
   type: 'two_equal',
   title: toolbarMessages.twoColumns,
@@ -75,7 +79,8 @@ var LAYOUT_DISTRIBUTION_TYPES = [{
   title: toolbarMessages.leftSidebar,
   icon: LayoutTwoColumnsSidebarLeftIcon,
   iconFallback: LayoutTwoLeftSidebarIcon
-}, {
+}];
+var LAYOUT_WITH_THREE_COL_DISTRIBUTION = [{
   id: 'editor.layout.threeEquals',
   type: 'three_equal',
   title: toolbarMessages.threeColumns,
@@ -87,13 +92,19 @@ var LAYOUT_DISTRIBUTION_TYPES = [{
   title: toolbarMessages.threeColumnsWithSidebars,
   icon: LayoutThreeColumnsSidebarsIcon,
   iconFallback: LayoutThreeWithSidebarsIcon
+}, {
+  id: 'editor.layout.threeRightSidebars',
+  type: 'three_right_sidebars',
+  title: toolbarMessages.threeColumnsWithRightSidebars,
+  icon: LayoutThreeWithRightSidebarsIcon,
+  iconFallback: LayoutThreeWithRightSidebarsIcon
+}, {
+  id: 'editor.layout.threeLeftSidebars',
+  type: 'three_left_sidebars',
+  title: toolbarMessages.threeColumnsWithLeftSidebars,
+  icon: LayoutThreeWithLeftSidebarsIcon,
+  iconFallback: LayoutThreeWithLeftSidebarsIcon
 }];
-var SIDEBAR_LAYOUT_TYPES_BY_COLUMNS = {
-  2: [LAYOUT_DISTRIBUTION_TYPES[0], LAYOUT_DISTRIBUTION_TYPES[1], LAYOUT_DISTRIBUTION_TYPES[2]],
-  3: [LAYOUT_DISTRIBUTION_TYPES[3], LAYOUT_DISTRIBUTION_TYPES[4]],
-  4: [],
-  5: []
-};
 var buildLayoutButton = function buildLayoutButton(intl, item, currentLayout, editorAnalyticsAPI) {
   return {
     id: item.id,
@@ -109,15 +120,81 @@ var buildLayoutButton = function buildLayoutButton(intl, item, currentLayout, ed
 };
 export var layoutToolbarTitle = 'Layout floating controls';
 var iconPlaceholder = LayoutTwoColumnsIcon; // TODO: Replace with proper icon ED-25466
+
+var getAdvancedLayoutItems = function getAdvancedLayoutItems(_ref) {
+  var addSidebarLayouts = _ref.addSidebarLayouts,
+    intl = _ref.intl,
+    editorAnalyticsAPI = _ref.editorAnalyticsAPI,
+    state = _ref.state,
+    node = _ref.node,
+    nodeType = _ref.nodeType,
+    separator = _ref.separator,
+    deleteButton = _ref.deleteButton,
+    currentLayout = _ref.currentLayout;
+  var numberOfColumns = node.content.childCount || 2;
+  var distributionOptions = numberOfColumns === 2 ? LAYOUT_WITH_TWO_COL_DISTRIBUTION : numberOfColumns === 3 ? LAYOUT_WITH_THREE_COL_DISTRIBUTION : [];
+  var columnOptions = [{
+    title: intl.formatMessage(layoutMessages.columnOption, {
+      count: 2
+    }),
+    //'2-columns',
+    icon: iconPlaceholder,
+    onClick: setPresetLayout(editorAnalyticsAPI)('two_equal', intl.formatMessage),
+    selected: numberOfColumns === 2
+  }, {
+    title: intl.formatMessage(layoutMessages.columnOption, {
+      count: 3
+    }),
+    //'3-columns'
+    icon: iconPlaceholder,
+    onClick: setPresetLayout(editorAnalyticsAPI)('three_equal', intl.formatMessage),
+    selected: numberOfColumns === 3
+  }, {
+    title: intl.formatMessage(layoutMessages.columnOption, {
+      count: 4
+    }),
+    //'4-columns'
+    icon: iconPlaceholder,
+    onClick: setPresetLayout(editorAnalyticsAPI)('four_equal', intl.formatMessage),
+    selected: numberOfColumns === 4
+  }, {
+    title: intl.formatMessage(layoutMessages.columnOption, {
+      count: 5
+    }),
+    //'5-columns'
+    icon: iconPlaceholder,
+    onClick: setPresetLayout(editorAnalyticsAPI)('five_equal', intl.formatMessage),
+    selected: numberOfColumns === 5
+  }];
+  return [{
+    type: 'dropdown',
+    title: intl.formatMessage(layoutMessages.columnOption, {
+      count: numberOfColumns
+    }),
+    //`${numberOfColumns}-columns`,
+    options: columnOptions,
+    showSelected: true,
+    testId: 'column-options-button'
+  }].concat(_toConsumableArray(distributionOptions.length > 0 ? [separator] : []), _toConsumableArray(addSidebarLayouts ? distributionOptions.map(function (i) {
+    return buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI);
+  }) : []), [separator, {
+    type: 'copy-button',
+    supportsViewMode: !fg('platform_editor_remove_copy_button_from_view_mode'),
+    items: [{
+      state: state,
+      formatMessage: intl.formatMessage,
+      nodeType: nodeType
+    }]
+  }, separator, deleteButton]);
+};
 export var buildToolbar = function buildToolbar(state, intl, pos, _allowBreakout, addSidebarLayouts, allowSingleColumnLayout, api) {
   var _api$decorations$acti, _api$decorations, _api$analytics;
-  var _ref = (_api$decorations$acti = api === null || api === void 0 || (_api$decorations = api.decorations) === null || _api$decorations === void 0 ? void 0 : _api$decorations.actions) !== null && _api$decorations$acti !== void 0 ? _api$decorations$acti : {},
-    hoverDecoration = _ref.hoverDecoration;
+  var _ref2 = (_api$decorations$acti = api === null || api === void 0 || (_api$decorations = api.decorations) === null || _api$decorations === void 0 ? void 0 : _api$decorations.actions) !== null && _api$decorations$acti !== void 0 ? _api$decorations$acti : {},
+    hoverDecoration = _ref2.hoverDecoration;
   var editorAnalyticsAPI = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
   var node = state.doc.nodeAt(pos);
   if (node) {
     var currentLayout = getPresetLayout(node);
-    var numberOfColumns = node.content.childCount || 2;
     var separator = {
       type: 'separator'
     };
@@ -138,41 +215,7 @@ export var buildToolbar = function buildToolbar(state, intl, pos, _allowBreakout
       onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false),
       tabIndex: null
     };
-    var layoutTypes = isPreRelease2() ? [] : allowSingleColumnLayout ? LAYOUT_TYPES_WITH_SINGLE_COL : LAYOUT_TYPES;
-    var columnOptions = [{
-      title: intl.formatMessage(layoutMessages.columnOption, {
-        count: 2
-      }),
-      //'2-columns',
-      icon: iconPlaceholder,
-      onClick: setPresetLayout(editorAnalyticsAPI)('two_equal', intl.formatMessage),
-      selected: numberOfColumns === 2
-    }, {
-      title: intl.formatMessage(layoutMessages.columnOption, {
-        count: 3
-      }),
-      //'3-columns'
-      icon: iconPlaceholder,
-      onClick: setPresetLayout(editorAnalyticsAPI)('three_equal', intl.formatMessage),
-      selected: numberOfColumns === 3
-    }, {
-      title: intl.formatMessage(layoutMessages.columnOption, {
-        count: 4
-      }),
-      //'4-columns'
-      icon: iconPlaceholder,
-      onClick: setPresetLayout(editorAnalyticsAPI)('four_equal', intl.formatMessage),
-      selected: numberOfColumns === 4
-    }, {
-      title: intl.formatMessage(layoutMessages.columnOption, {
-        count: 5
-      }),
-      //'5-columns'
-      icon: iconPlaceholder,
-      onClick: setPresetLayout(editorAnalyticsAPI)('five_equal', intl.formatMessage),
-      selected: numberOfColumns === 5
-    }];
-    var sidebarTypesByColumns = SIDEBAR_LAYOUT_TYPES_BY_COLUMNS[numberOfColumns] || [];
+    var layoutTypes = allowSingleColumnLayout ? LAYOUT_TYPES_WITH_SINGLE_COL : LAYOUT_TYPES;
     return {
       title: layoutToolbarTitle,
       getDomRef: function getDomRef(view) {
@@ -180,20 +223,19 @@ export var buildToolbar = function buildToolbar(state, intl, pos, _allowBreakout
       },
       nodeType: nodeType,
       groupLabel: intl.formatMessage(toolbarMessages.floatingToolbarRadioGroupAriaLabel),
-      items: [].concat(_toConsumableArray(isPreRelease2() ? [{
-        type: 'dropdown',
-        title: intl.formatMessage(layoutMessages.columnOption, {
-          count: numberOfColumns
-        }),
-        //`${numberOfColumns}-columns`,
-        options: columnOptions,
-        showSelected: true,
-        testId: 'column-options-button'
-      }].concat(_toConsumableArray(sidebarTypesByColumns.length > 0 ? [separator] : [])) : []), _toConsumableArray(layoutTypes.map(function (i) {
-        return buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI);
-      })), _toConsumableArray(addSidebarLayouts ? isPreRelease2() ? sidebarTypesByColumns.map(function (i) {
+      items: isPreRelease2() ? getAdvancedLayoutItems({
+        addSidebarLayouts: addSidebarLayouts,
+        intl: intl,
+        editorAnalyticsAPI: editorAnalyticsAPI,
+        state: state,
+        nodeType: nodeType,
+        node: node,
+        separator: separator,
+        deleteButton: deleteButton,
+        currentLayout: currentLayout
+      }) : [].concat(_toConsumableArray(layoutTypes.map(function (i) {
         return buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI);
-      }) : SIDEBAR_LAYOUT_TYPES.map(function (i) {
+      })), _toConsumableArray(addSidebarLayouts ? SIDEBAR_LAYOUT_TYPES.map(function (i) {
         return buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI);
       }) : []), [separator, {
         type: 'copy-button',

package/dist/esm/ui/icons/LayoutThreeWithLeftSidebars.js

@@ -0,0 +1,48 @@
+import _extends from "@babel/runtime/helpers/extends";
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css, jsx } from '@emotion/react';
+import Icon from '@atlaskit/icon';
+import { fg } from '@atlaskit/platform-feature-flags';
+var LayoutThreeWithLeftSidebarsGlyph = function LayoutThreeWithLeftSidebarsGlyph(props) {
+  if (fg('platform-visual-refresh-icons')) {
+    return jsx("svg", _extends({
+      width: "16",
+      height: "14",
+      viewBox: "0 0 16 14",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg"
+    }, props), jsx("path", {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M7.5 1.375C7.5 0.615609 8.11561 0 8.875 0H9.625C10.3844 0 11 0.615608 11 1.375V12.625C11 13.3844 10.3844 14 9.625 14H8.875C8.11561 14 7.5 13.3844 7.5 12.625V1.375ZM9 1.5V12.5H9.5V1.5H9ZM0 1.37505C0 0.615655 0.615608 4.66853e-05 1.375 4.66853e-05H4.625C5.38439 4.66853e-05 6 0.615655 6 1.37505V12.625C6 13.3844 5.38439 14 4.625 14H1.375C0.615608 14 0 13.3844 0 12.625V1.37505ZM1.5 1.50005V12.5H4.5V1.50005H1.5ZM12.5 1.37505C12.5 0.615655 13.1156 4.66853e-05 13.875 4.66853e-05H14.625C15.3844 4.66853e-05 16 0.615655 16 1.37505V12.625C16 13.3844 15.3844 14 14.625 14H13.875C13.1156 14 12.5 13.3844 12.5 12.625V1.37505ZM14 1.50005V12.5H14.5V1.50005H14Z",
+      fill: "currentcolor"
+    }));
+  }
+  return jsx("svg", _extends({
+    width: "16",
+    height: "14",
+    viewBox: "0 0 16 14",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), jsx("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M1 0C1.26522 0 1.51957 0.105357 1.70711 0.292893C1.89464 0.48043 2 0.734784 2 1V13C2 13.2652 1.89464 13.5196 1.70711 13.7071C1.51957 13.8946 1.26522 14 1 14C0.734784 14 0.48043 13.8946 0.292893 13.7071C0.105357 13.5196 0 13.2652 0 13V1C0 0.734784 0.105357 0.48043 0.292893 0.292893C0.48043 0.105357 0.734784 0 1 0ZM9 0H15C15.2652 0 15.5196 0.105357 15.7071 0.292893C15.8946 0.48043 16 0.734784 16 1V13C16 13.2652 15.8946 13.5196 15.7071 13.7071C15.5196 13.8946 15.2652 14 15 14H9C8.73478 14 8.48043 13.8946 8.29289 13.7071C8.10536 13.5196 8 13.2652 8 13V1C8 0.734784 8.10536 0.48043 8.29289 0.292893C8.48043 0.105357 8.73478 0 9 0ZM5 0C5.26522 0 5.51957 0.105356 5.70711 0.292892C5.89464 0.480429 6 0.734784 6 1V13C6 13.2652 5.89464 13.5196 5.70711 13.7071C5.51957 13.8946 5.26522 14 5 14C4.73478 14 4.48043 13.8946 4.29289 13.7071C4.10536 13.5196 4 13.2652 4 13V1C4 0.734784 4.10536 0.480429 4.29289 0.292892C4.48043 0.105356 4.73478 0 5 0Z",
+    fill: "currentcolor"
+  }));
+};
+var floatingToolbarPadding = css({
+  paddingRight: "var(--ds-space-050, 4px)",
+  paddingLeft: "var(--ds-space-050, 4px)"
+});
+export var LayoutThreeWithLeftSidebarsIcon = function LayoutThreeWithLeftSidebarsIcon(props) {
+  return jsx("span", {
+    css: floatingToolbarPadding
+  }, jsx(Icon, _extends({
+    glyph: LayoutThreeWithLeftSidebarsGlyph
+  }, props)));
+};

package/dist/esm/ui/icons/LayoutThreeWithRightSidebars.js

@@ -0,0 +1,48 @@
+import _extends from "@babel/runtime/helpers/extends";
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css, jsx } from '@emotion/react';
+import Icon from '@atlaskit/icon';
+import { fg } from '@atlaskit/platform-feature-flags';
+var LayoutThreeWithRightSidebarsGlyph = function LayoutThreeWithRightSidebarsGlyph(props) {
+  if (fg('platform-visual-refresh-icons')) {
+    return jsx("svg", _extends({
+      width: "16",
+      height: "14",
+      viewBox: "0 0 16 14",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg"
+    }, props), jsx("path", {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M8.5 1.375C8.5 0.615609 7.88439 0 7.125 0H6.375C5.61561 0 5 0.615608 5 1.375V12.625C5 13.3844 5.61561 14 6.375 14H7.125C7.88439 14 8.5 13.3844 8.5 12.625V1.375ZM7 1.5V12.5H6.5V1.5H7ZM16 1.37505C16 0.615655 15.3844 4.66853e-05 14.625 4.66853e-05H11.375C10.6156 4.66853e-05 10 0.615655 10 1.37505V12.625C10 13.3844 10.6156 14 11.375 14H14.625C15.3844 14 16 13.3844 16 12.625V1.37505ZM14.5 1.50005V12.5H11.5V1.50005H14.5ZM3.5 1.37505C3.5 0.615655 2.88439 4.66853e-05 2.125 4.66853e-05H1.375C0.615608 4.66853e-05 0 0.615655 0 1.37505V12.625C0 13.3844 0.615608 14 1.375 14H2.125C2.88439 14 3.5 13.3844 3.5 12.625V1.37505ZM2 1.50005V12.5H1.5V1.50005H2Z",
+      fill: "currentcolor"
+    }));
+  }
+  return jsx("svg", _extends({
+    width: "16",
+    height: "14",
+    viewBox: "0 0 16 14",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), jsx("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M11 0C11.2652 0 11.5196 0.105357 11.7071 0.292893C11.8946 0.48043 12 0.734784 12 1V13C12 13.2652 11.8946 13.5196 11.7071 13.7071C11.5196 13.8946 11.2652 14 11 14C10.7348 14 10.4804 13.8946 10.2929 13.7071C10.1054 13.5196 10 13.2652 10 13V1C10 0.734784 10.1054 0.48043 10.2929 0.292893C10.4804 0.105357 10.7348 0 11 0ZM1 0H7C7.26522 0 7.51957 0.105357 7.70711 0.292893C7.89464 0.48043 8 0.734784 8 1V13C8 13.2652 7.89464 13.5196 7.70711 13.7071C7.51957 13.8946 7.26522 14 7 14H1C0.734784 14 0.48043 13.8946 0.292893 13.7071C0.105357 13.5196 0 13.2652 0 13V1C0 0.734784 0.105357 0.48043 0.292893 0.292893C0.48043 0.105357 0.734784 0 1 0ZM15 0C15.2652 0 15.5196 0.105357 15.7071 0.292893C15.8946 0.48043 16 0.734784 16 1V13C16 13.2652 15.8946 13.5196 15.7071 13.7071C15.5196 13.8946 15.2652 14 15 14C14.7348 14 14.4804 13.8946 14.2929 13.7071C14.1054 13.5196 14 13.2652 14 13V1C14 0.734784 14.1054 0.48043 14.2929 0.292893C14.4804 0.105357 14.7348 0 15 0Z",
+    fill: "currentcolor"
+  }));
+};
+var floatingToolbarPadding = css({
+  paddingRight: "var(--ds-space-050, 4px)",
+  paddingLeft: "var(--ds-space-050, 4px)"
+});
+export var LayoutThreeWithRightSidebarsIcon = function LayoutThreeWithRightSidebarsIcon(props) {
+  return jsx("span", {
+    css: floatingToolbarPadding
+  }, jsx(Icon, _extends({
+    glyph: LayoutThreeWithRightSidebarsGlyph
+  }, props)));
+};

package/dist/types/actions.d.ts

@@ -7,8 +7,6 @@ import type { Change, PresetLayout } from './types';
 export declare const ONE_COL_LAYOUTS: PresetLayout[];
 export declare const TWO_COL_LAYOUTS: PresetLayout[];
 export declare const THREE_COL_LAYOUTS: PresetLayout[];
-export declare const FOUR_COL_LAYOUTS: PresetLayout[];
-export declare const FIVE_COL_LAYOUTS: PresetLayout[];
 /**
  * Finds layout preset based on the width attrs of all the layoutColumn nodes
  * inside the layoutSection node

package/dist/types/types.d.ts

@@ -6,7 +6,7 @@ export interface LayoutPluginOptions extends LongPressSelectionPluginOptions {
     UNSAFE_allowSingleColumnLayout?: boolean;
     editorAppearance?: EditorAppearance;
 }
-export type PresetLayout = 'single' | 'two_equal' | 'three_equal' | 'two_right_sidebar' | 'two_left_sidebar' | 'three_with_sidebars' | 'four_equal' | 'five_equal';
+export type PresetLayout = 'single' | 'two_equal' | 'three_equal' | 'two_right_sidebar' | 'two_left_sidebar' | 'three_with_sidebars' | 'three_left_sidebars' | 'three_right_sidebars' | 'four_equal' | 'five_equal';
 export interface Change {
     from: number;
     to: number;

package/dist/types/ui/icons/LayoutThreeWithLeftSidebars.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+import { jsx } from '@emotion/react';
+import { type IconProps } from '@atlaskit/icon';
+export declare const LayoutThreeWithLeftSidebarsIcon: (props: Omit<IconProps, 'glyph'>) => jsx.JSX.Element;

package/dist/types/ui/icons/LayoutThreeWithRightSidebars.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+import { jsx } from '@emotion/react';
+import { type IconProps } from '@atlaskit/icon';
+export declare const LayoutThreeWithRightSidebarsIcon: (props: Omit<IconProps, 'glyph'>) => jsx.JSX.Element;

package/dist/types-ts4.5/actions.d.ts

@@ -7,8 +7,6 @@ import type { Change, PresetLayout } from './types';
 export declare const ONE_COL_LAYOUTS: PresetLayout[];
 export declare const TWO_COL_LAYOUTS: PresetLayout[];
 export declare const THREE_COL_LAYOUTS: PresetLayout[];
-export declare const FOUR_COL_LAYOUTS: PresetLayout[];
-export declare const FIVE_COL_LAYOUTS: PresetLayout[];
 /**
  * Finds layout preset based on the width attrs of all the layoutColumn nodes
  * inside the layoutSection node

package/dist/types-ts4.5/types.d.ts

@@ -6,7 +6,7 @@ export interface LayoutPluginOptions extends LongPressSelectionPluginOptions {
     UNSAFE_allowSingleColumnLayout?: boolean;
     editorAppearance?: EditorAppearance;
 }
-export type PresetLayout = 'single' | 'two_equal' | 'three_equal' | 'two_right_sidebar' | 'two_left_sidebar' | 'three_with_sidebars' | 'four_equal' | 'five_equal';
+export type PresetLayout = 'single' | 'two_equal' | 'three_equal' | 'two_right_sidebar' | 'two_left_sidebar' | 'three_with_sidebars' | 'three_left_sidebars' | 'three_right_sidebars' | 'four_equal' | 'five_equal';
 export interface Change {
     from: number;
     to: number;

package/dist/types-ts4.5/ui/icons/LayoutThreeWithLeftSidebars.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+import { jsx } from '@emotion/react';
+import { type IconProps } from '@atlaskit/icon';
+export declare const LayoutThreeWithLeftSidebarsIcon: (props: Omit<IconProps, 'glyph'>) => jsx.JSX.Element;

package/dist/types-ts4.5/ui/icons/LayoutThreeWithRightSidebars.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+import { jsx } from '@emotion/react';
+import { type IconProps } from '@atlaskit/icon';
+export declare const LayoutThreeWithRightSidebarsIcon: (props: Omit<IconProps, 'glyph'>) => jsx.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-layout",
-	"version": "1.12.3",
+	"version": "1.12.5",
 	"description": "Layout plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -31,17 +31,17 @@
 		".": "./src/index.ts"
 	},
 	"dependencies": {
-		"@atlaskit/adf-schema": "^44.2.0",
-		"@atlaskit/editor-common": "^94.24.0",
+		"@atlaskit/adf-schema": "^46.1.0",
+		"@atlaskit/editor-common": "^95.7.0",
 		"@atlaskit/editor-plugin-analytics": "^1.10.0",
 		"@atlaskit/editor-plugin-decorations": "^1.3.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^1.3.0",
 		"@atlaskit/editor-plugin-width": "^1.3.0",
 		"@atlaskit/editor-prosemirror": "6.0.0",
-		"@atlaskit/icon": "^22.24.0",
+		"@atlaskit/icon": "^22.26.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
-		"@atlaskit/tmp-editor-statsig": "^2.19.0",
-		"@atlaskit/tokens": "^2.2.0",
+		"@atlaskit/tmp-editor-statsig": "^2.21.0",
+		"@atlaskit/tokens": "^2.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1"
 	},
@@ -99,6 +99,9 @@
 		},
 		"platform_editor_advanced_layouts_breakout_resizing": {
 			"type": "boolean"
+		},
+		"platform-visual-refresh-icons": {
+			"type": "boolean"
 		}
 	}
 }