@atlaskit/editor-plugin-layout 2.3.2 → 2.4.1

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @atlaskit/editor-plugin-layout
 
+## 2.4.1
+
+### Patch Changes
+
+- [#134468](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/134468)
+  [`e312ec529d05a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e312ec529d05a) -
+  [ux] Apply hover decoration when hovering on copy/delete button on overflow menu
+- Updated dependencies
+
+## 2.4.0
+
+### Minor Changes
+
+- [#132381](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/132381)
+  [`19e52e77d3cfc`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/19e52e77d3cfc) -
+  ED-27195 enable guildeline for breakout resizer
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 2.3.2
 
 ### Patch Changes

package/dist/cjs/nodeviews/index.js

@@ -16,6 +16,7 @@ var _hooks = require("@atlaskit/editor-common/hooks");
 var _reactNodeView = _interopRequireDefault(require("@atlaskit/editor-common/react-node-view"));
 var _resizer = require("@atlaskit/editor-common/resizer");
 var _model = require("@atlaskit/editor-prosemirror/model");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 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; }
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
@@ -61,6 +62,12 @@ var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
     var _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$s;
     return (_pluginInjectionApi$c = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c2 = pluginInjectionApi.core) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : _pluginInjectionApi$c2.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$s = pluginInjectionApi.selection) === null || _pluginInjectionApi$s === void 0 ? void 0 : _pluginInjectionApi$s.commands.displayGapCursor(toggle))) !== null && _pluginInjectionApi$c !== void 0 ? _pluginInjectionApi$c : false;
   }, [pluginInjectionApi]);
+  var displayGuidelines = (0, _react.useCallback)(function (guidelines) {
+    var _pluginInjectionApi$g;
+    pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$g = pluginInjectionApi.guideline) === null || _pluginInjectionApi$g === void 0 || (_pluginInjectionApi$g = _pluginInjectionApi$g.actions) === null || _pluginInjectionApi$g === void 0 || _pluginInjectionApi$g.displayGuideline(view)({
+      guidelines: guidelines
+    });
+  }, [pluginInjectionApi, view]);
   return /*#__PURE__*/_react.default.createElement(_resizer.BreakoutResizer, {
     getRef: forwardRef,
     getPos: getPos,
@@ -70,6 +77,7 @@ var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
     disabled: (editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled) === true || !isBreakoutAvailable(view.state.schema),
     parentRef: parentRef,
     editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
+    displayGuidelines: (0, _experiments.editorExperiment)('single_column_layouts', true) ? displayGuidelines : undefined,
     displayGapCursor: displayGapCursor
   });
 };

package/dist/cjs/ui/toolbar.js

@@ -6,10 +6,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.layoutToolbarTitle = exports.buildToolbar = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _react = _interopRequireDefault(require("react"));
 var _messages = _interopRequireWildcard(require("@atlaskit/editor-common/messages"));
 var _utils = require("@atlaskit/editor-prosemirror/utils");
+var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _copy = _interopRequireDefault(require("@atlaskit/icon/core/copy"));
 var _deleteEditorRemove = _interopRequireDefault(require("@atlaskit/icon/core/migration/delete--editor-remove"));
 var _layoutOneColumnEditorLayoutSingle = _interopRequireDefault(require("@atlaskit/icon/core/migration/layout-one-column--editor-layout-single"));
@@ -18,12 +20,15 @@ var _layoutThreeColumnsSidebarsEditorLayoutThreeWithSidebars = _interopRequireDe
 var _layoutTwoColumnsEditorLayoutTwoEqual = _interopRequireDefault(require("@atlaskit/icon/core/migration/layout-two-columns--editor-layout-two-equal"));
 var _layoutTwoColumnsSidebarLeftEditorLayoutTwoLeftSidebar = _interopRequireDefault(require("@atlaskit/icon/core/migration/layout-two-columns-sidebar-left--editor-layout-two-left-sidebar"));
 var _layoutTwoColumnsSidebarRightEditorLayoutTwoRightSidebar = _interopRequireDefault(require("@atlaskit/icon/core/migration/layout-two-columns-sidebar-right--editor-layout-two-right-sidebar"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _actions = require("../pm-plugins/actions");
 var _LayoutThreeWithLeftSidebars = require("./icons/LayoutThreeWithLeftSidebars");
 var _LayoutThreeWithRightSidebars = require("./icons/LayoutThreeWithRightSidebars");
 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; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var LAYOUT_TYPES = [{
   id: 'editor.layout.twoEquals',
   type: 'two_equal',
@@ -222,9 +227,17 @@ var buildToolbar = exports.buildToolbar = function buildToolbar(state, intl, pos
       }]
     };
     var layoutTypes = allowSingleColumnLayout ? LAYOUT_TYPES_WITH_SINGLE_COL : LAYOUT_TYPES;
+    var hoverDecorationProps = function hoverDecorationProps(nodeType, className) {
+      return (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_1') ? {
+        onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, true, className),
+        onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false, className),
+        onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, true, className),
+        onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false, className)
+      } : undefined;
+    };
     var overflowMenu = {
       type: 'overflow-dropdown',
-      options: [{
+      options: [_objectSpread({
         title: 'Copy',
         onClick: function onClick() {
           var _api$core, _api$floatingToolbar;
@@ -235,13 +248,13 @@ var buildToolbar = exports.buildToolbar = function buildToolbar(state, intl, pos
         icon: /*#__PURE__*/_react.default.createElement(_copy.default, {
           label: "Copy"
         })
-      }, {
+      }, hoverDecorationProps(nodeType, _editorSharedStyles.akEditorSelectedNodeClassName)), _objectSpread({
         title: 'Delete',
         onClick: (0, _actions.deleteActiveLayoutNode)(editorAnalyticsAPI),
         icon: /*#__PURE__*/_react.default.createElement(_deleteEditorRemove.default, {
           label: "Delete"
         })
-      }]
+      }, hoverDecorationProps(nodeType))]
     };
     return {
       title: layoutToolbarTitle,

package/dist/es2019/nodeviews/index.js

@@ -3,6 +3,7 @@ import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import { BreakoutResizer, ignoreResizerMutations } from '@atlaskit/editor-common/resizer';
 import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 const isEmptyParagraph = node => {
   return !!node && node.type.name === 'paragraph' && !node.childCount;
 };
@@ -46,6 +47,12 @@ const LayoutBreakoutResizer = ({
     var _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$s;
     return (_pluginInjectionApi$c = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$c2 = pluginInjectionApi.core) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : _pluginInjectionApi$c2.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$s = pluginInjectionApi.selection) === null || _pluginInjectionApi$s === void 0 ? void 0 : _pluginInjectionApi$s.commands.displayGapCursor(toggle))) !== null && _pluginInjectionApi$c !== void 0 ? _pluginInjectionApi$c : false;
   }, [pluginInjectionApi]);
+  const displayGuidelines = useCallback(guidelines => {
+    var _pluginInjectionApi$g, _pluginInjectionApi$g2;
+    pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$g = pluginInjectionApi.guideline) === null || _pluginInjectionApi$g === void 0 ? void 0 : (_pluginInjectionApi$g2 = _pluginInjectionApi$g.actions) === null || _pluginInjectionApi$g2 === void 0 ? void 0 : _pluginInjectionApi$g2.displayGuideline(view)({
+      guidelines
+    });
+  }, [pluginInjectionApi, view]);
   return /*#__PURE__*/React.createElement(BreakoutResizer, {
     getRef: forwardRef,
     getPos: getPos,
@@ -55,6 +62,7 @@ const LayoutBreakoutResizer = ({
     disabled: (editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled) === true || !isBreakoutAvailable(view.state.schema),
     parentRef: parentRef,
     editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
+    displayGuidelines: editorExperiment('single_column_layouts', true) ? displayGuidelines : undefined,
     displayGapCursor: displayGapCursor
   });
 };

package/dist/es2019/ui/toolbar.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import commonMessages, { layoutMessages, layoutMessages as toolbarMessages } from '@atlaskit/editor-common/messages';
 import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
+import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
 import CopyIcon from '@atlaskit/icon/core/copy';
 import DeleteIcon from '@atlaskit/icon/core/migration/delete--editor-remove';
 import LayoutOneColumnIcon from '@atlaskit/icon/core/migration/layout-one-column--editor-layout-single';
@@ -9,6 +10,7 @@ import LayoutThreeColumnsSidebarsIcon from '@atlaskit/icon/core/migration/layout
 import LayoutTwoColumnsIcon from '@atlaskit/icon/core/migration/layout-two-columns--editor-layout-two-equal';
 import LayoutTwoColumnsSidebarLeftIcon from '@atlaskit/icon/core/migration/layout-two-columns-sidebar-left--editor-layout-two-left-sidebar';
 import LayoutTwoColumnsSidebarRightIcon from '@atlaskit/icon/core/migration/layout-two-columns-sidebar-right--editor-layout-two-right-sidebar';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { deleteActiveLayoutNode, getPresetLayout, setPresetLayout } from '../pm-plugins/actions';
 import { LayoutThreeWithLeftSidebarsIcon } from './icons/LayoutThreeWithLeftSidebars';
@@ -209,6 +211,12 @@ export const buildToolbar = (state, intl, pos, _allowBreakout, addSidebarLayouts
       }]
     };
     const layoutTypes = allowSingleColumnLayout ? LAYOUT_TYPES_WITH_SINGLE_COL : LAYOUT_TYPES;
+    const hoverDecorationProps = (nodeType, className) => fg('platform_editor_controls_patch_1') ? {
+      onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, true, className),
+      onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false, className),
+      onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, true, className),
+      onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false, className)
+    } : undefined;
     const overflowMenu = {
       type: 'overflow-dropdown',
       options: [{
@@ -221,13 +229,15 @@ export const buildToolbar = (state, intl, pos, _allowBreakout, addSidebarLayouts
         },
         icon: /*#__PURE__*/React.createElement(CopyIcon, {
           label: "Copy"
-        })
+        }),
+        ...hoverDecorationProps(nodeType, akEditorSelectedNodeClassName)
       }, {
         title: 'Delete',
         onClick: deleteActiveLayoutNode(editorAnalyticsAPI),
         icon: /*#__PURE__*/React.createElement(DeleteIcon, {
           label: "Delete"
-        })
+        }),
+        ...hoverDecorationProps(nodeType)
       }]
     };
     return {

package/dist/esm/nodeviews/index.js

@@ -10,6 +10,7 @@ import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import { BreakoutResizer, ignoreResizerMutations } from '@atlaskit/editor-common/resizer';
 import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 var isEmptyParagraph = function isEmptyParagraph(node) {
   return !!node && node.type.name === 'paragraph' && !node.childCount;
 };
@@ -51,6 +52,12 @@ var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
     var _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$s;
     return (_pluginInjectionApi$c = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c2 = pluginInjectionApi.core) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : _pluginInjectionApi$c2.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$s = pluginInjectionApi.selection) === null || _pluginInjectionApi$s === void 0 ? void 0 : _pluginInjectionApi$s.commands.displayGapCursor(toggle))) !== null && _pluginInjectionApi$c !== void 0 ? _pluginInjectionApi$c : false;
   }, [pluginInjectionApi]);
+  var displayGuidelines = useCallback(function (guidelines) {
+    var _pluginInjectionApi$g;
+    pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$g = pluginInjectionApi.guideline) === null || _pluginInjectionApi$g === void 0 || (_pluginInjectionApi$g = _pluginInjectionApi$g.actions) === null || _pluginInjectionApi$g === void 0 || _pluginInjectionApi$g.displayGuideline(view)({
+      guidelines: guidelines
+    });
+  }, [pluginInjectionApi, view]);
   return /*#__PURE__*/React.createElement(BreakoutResizer, {
     getRef: forwardRef,
     getPos: getPos,
@@ -60,6 +67,7 @@ var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
     disabled: (editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled) === true || !isBreakoutAvailable(view.state.schema),
     parentRef: parentRef,
     editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
+    displayGuidelines: editorExperiment('single_column_layouts', true) ? displayGuidelines : undefined,
     displayGapCursor: displayGapCursor
   });
 };

package/dist/esm/ui/toolbar.js

@@ -1,7 +1,11 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React from 'react';
 import commonMessages, { layoutMessages, layoutMessages as toolbarMessages } from '@atlaskit/editor-common/messages';
 import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
+import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
 import CopyIcon from '@atlaskit/icon/core/copy';
 import DeleteIcon from '@atlaskit/icon/core/migration/delete--editor-remove';
 import LayoutOneColumnIcon from '@atlaskit/icon/core/migration/layout-one-column--editor-layout-single';
@@ -10,6 +14,7 @@ import LayoutThreeColumnsSidebarsIcon from '@atlaskit/icon/core/migration/layout
 import LayoutTwoColumnsIcon from '@atlaskit/icon/core/migration/layout-two-columns--editor-layout-two-equal';
 import LayoutTwoColumnsSidebarLeftIcon from '@atlaskit/icon/core/migration/layout-two-columns-sidebar-left--editor-layout-two-left-sidebar';
 import LayoutTwoColumnsSidebarRightIcon from '@atlaskit/icon/core/migration/layout-two-columns-sidebar-right--editor-layout-two-right-sidebar';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { deleteActiveLayoutNode, getPresetLayout, setPresetLayout } from '../pm-plugins/actions';
 import { LayoutThreeWithLeftSidebarsIcon } from './icons/LayoutThreeWithLeftSidebars';
@@ -212,9 +217,17 @@ export var buildToolbar = function buildToolbar(state, intl, pos, _allowBreakout
       }]
     };
     var layoutTypes = allowSingleColumnLayout ? LAYOUT_TYPES_WITH_SINGLE_COL : LAYOUT_TYPES;
+    var hoverDecorationProps = function hoverDecorationProps(nodeType, className) {
+      return fg('platform_editor_controls_patch_1') ? {
+        onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, true, className),
+        onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false, className),
+        onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, true, className),
+        onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false, className)
+      } : undefined;
+    };
     var overflowMenu = {
       type: 'overflow-dropdown',
-      options: [{
+      options: [_objectSpread({
         title: 'Copy',
         onClick: function onClick() {
           var _api$core, _api$floatingToolbar;
@@ -225,13 +238,13 @@ export var buildToolbar = function buildToolbar(state, intl, pos, _allowBreakout
         icon: /*#__PURE__*/React.createElement(CopyIcon, {
           label: "Copy"
         })
-      }, {
+      }, hoverDecorationProps(nodeType, akEditorSelectedNodeClassName)), _objectSpread({
         title: 'Delete',
         onClick: deleteActiveLayoutNode(editorAnalyticsAPI),
         icon: /*#__PURE__*/React.createElement(DeleteIcon, {
           label: "Delete"
         })
-      }]
+      }, hoverDecorationProps(nodeType))]
     };
     return {
       title: layoutToolbarTitle,

package/dist/types/layoutPluginType.d.ts

@@ -2,6 +2,7 @@ import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/t
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { DecorationsPlugin } from '@atlaskit/editor-plugin-decorations';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
+import type { GuidelinePlugin } from '@atlaskit/editor-plugin-guideline';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
 import type { insertLayoutColumnsWithAnalytics } from './pm-plugins/actions';
@@ -11,7 +12,8 @@ export type LayoutPluginDependencies = [
     SelectionPlugin,
     OptionalPlugin<AnalyticsPlugin>,
     OptionalPlugin<WidthPlugin>,
-    OptionalPlugin<EditorDisabledPlugin>
+    OptionalPlugin<EditorDisabledPlugin>,
+    OptionalPlugin<GuidelinePlugin>
 ];
 export type LayoutPlugin = NextEditorPlugin<'layout', {
     pluginConfiguration: LayoutPluginOptions | undefined;

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

@@ -2,6 +2,7 @@ import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/t
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { DecorationsPlugin } from '@atlaskit/editor-plugin-decorations';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
+import type { GuidelinePlugin } from '@atlaskit/editor-plugin-guideline';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
 import type { insertLayoutColumnsWithAnalytics } from './pm-plugins/actions';
@@ -11,7 +12,8 @@ export type LayoutPluginDependencies = [
     SelectionPlugin,
     OptionalPlugin<AnalyticsPlugin>,
     OptionalPlugin<WidthPlugin>,
-    OptionalPlugin<EditorDisabledPlugin>
+    OptionalPlugin<EditorDisabledPlugin>,
+    OptionalPlugin<GuidelinePlugin>
 ];
 export type LayoutPlugin = NextEditorPlugin<'layout', {
     pluginConfiguration: LayoutPluginOptions | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-layout",
-	"version": "2.3.2",
+	"version": "2.4.1",
 	"description": "Layout plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -34,16 +34,18 @@
 	},
 	"dependencies": {
 		"@atlaskit/adf-schema": "^47.6.0",
-		"@atlaskit/editor-common": "^102.13.0",
+		"@atlaskit/editor-common": "^102.15.0",
 		"@atlaskit/editor-plugin-analytics": "^2.2.0",
 		"@atlaskit/editor-plugin-decorations": "^2.0.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^2.0.0",
+		"@atlaskit/editor-plugin-guideline": "^2.0.0",
 		"@atlaskit/editor-plugin-selection": "^2.1.0",
 		"@atlaskit/editor-plugin-width": "^3.0.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
-		"@atlaskit/icon": "^25.0.0",
+		"@atlaskit/editor-shared-styles": "^3.4.0",
+		"@atlaskit/icon": "^25.3.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/tmp-editor-statsig": "^4.4.0",
+		"@atlaskit/tmp-editor-statsig": "^4.6.0",
 		"@atlaskit/tokens": "^4.5.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1"
@@ -99,6 +101,9 @@
 	"platform-feature-flags": {
 		"platform-visual-refresh-icons": {
 			"type": "boolean"
+		},
+		"platform_editor_controls_patch_1": {
+			"type": "boolean"
 		}
 	}
 }