@atlaskit/editor-plugin-layout 10.9.0 → 10.9.2

package/dist/es2019/ui/LayoutColumnMenu/keys.js

@@ -15,8 +15,13 @@ export const LAYOUT_COLUMN_VERTICAL_ALIGN_MENU_SECTION = {
   type: 'menu-section',
   key: 'layout-column-vertical-align-menu-section'
 };
+export const LAYOUT_COLUMN_DANGER_SECTION = {
+  type: 'menu-section',
+  key: 'layout-column-danger-section'
+};
 export const LAYOUT_COLUMN_MENU_RANK = {
-  [LAYOUT_COLUMN_MENU_SECTION.key]: 100
+  [LAYOUT_COLUMN_MENU_SECTION.key]: 100,
+  [LAYOUT_COLUMN_DANGER_SECTION.key]: 200
 };
 
 // --- Menus ---
@@ -63,8 +68,10 @@ export const LAYOUT_COLUMN_MENU_SECTION_RANK = {
   [VERTICAL_ALIGN_MENU.key]: 100,
   [INSERT_COLUMN_LEFT_MENU_ITEM.key]: 200,
   [INSERT_COLUMN_RIGHT_MENU_ITEM.key]: 300,
-  [DISTRIBUTE_COLUMNS_MENU_ITEM.key]: 400,
-  [DELETE_COLUMN_MENU_ITEM.key]: 500
+  [DISTRIBUTE_COLUMNS_MENU_ITEM.key]: 400
+};
+export const LAYOUT_COLUMN_DANGER_SECTION_RANK = {
+  [DELETE_COLUMN_MENU_ITEM.key]: 100
 };
 export const VERTICAL_ALIGN_MENU_RANK = {
   [LAYOUT_COLUMN_VERTICAL_ALIGN_MENU_SECTION.key]: 100

package/dist/es2019/ui/LayoutColumnMenu/verticalAlignIcons.js

@@ -1,11 +1,11 @@
 // Disable no-re-export here, this is a useful mapping file for icon lookup used in multiple places
 /* eslint-disable @atlaskit/editor/no-re-export */
 
-import AlignContentBottomIcon from '@atlaskit/icon-lab/core/align-content-bottom';
-import AlignContentCenterVerticalIcon from '@atlaskit/icon-lab/core/align-content-center-vertical';
-import AlignContentTopIcon from '@atlaskit/icon-lab/core/align-content-top';
+import AlignPositionBottomIcon from '@atlaskit/icon-lab/core/align-position-bottom';
+import AlignPositionCenterVerticalIcon from '@atlaskit/icon-lab/core/align-position-center-vertical';
+import AlignPositionTopIcon from '@atlaskit/icon-lab/core/align-position-top';
 export const VERTICAL_ALIGN_ICONS = {
-  top: AlignContentTopIcon,
-  middle: AlignContentCenterVerticalIcon,
-  bottom: AlignContentBottomIcon
+  top: AlignPositionTopIcon,
+  middle: AlignPositionCenterVerticalIcon,
+  bottom: AlignPositionBottomIcon
 };

package/dist/es2019/ui/toolbar.js

@@ -227,8 +227,7 @@ const getAdvancedLayoutItems = ({
     disabled: isDistributedUniformly(getLayoutColumnWidths(node)),
     icon: TableColumnsDistributeIcon,
     onClick: (editorState, dispatch) => {
-      const tr = distributeLayoutColumns({
-        editorAnalyticsAPI,
+      const tr = distributeLayoutColumns(editorAnalyticsAPI)({
         inputMethod: INPUT_METHOD.FLOATING_TB,
         target: 'allColumns'
       })({

package/dist/esm/layoutPlugin.js

@@ -11,7 +11,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
-import { createDefaultLayoutSection, createDistributeLayoutColumnsCommand, createMultiColumnLayoutSection, deleteLayoutColumn as _deleteLayoutColumn, insertLayoutColumn as _insertLayoutColumn, insertLayoutColumnsWithAnalytics, setLayoutColumnValign as _setLayoutColumnValign, toggleLayoutColumnMenu } from './pm-plugins/actions';
+import { createDefaultLayoutSection, createMultiColumnLayoutSection, deleteLayoutColumn as _deleteLayoutColumn, distributeLayoutColumns, insertLayoutColumn as _insertLayoutColumn, insertLayoutColumnsWithAnalytics, setLayoutColumnValign as _setLayoutColumnValign, toggleLayoutColumnMenu } from './pm-plugins/actions';
 import { default as createLayoutPlugin } from './pm-plugins/main';
 import { pluginKey } from './pm-plugins/plugin-key';
 import { default as createLayoutResizingPlugin } from './pm-plugins/resizing';
@@ -374,7 +374,7 @@ export var layoutPlugin = function layoutPlugin(_ref) {
         var _api$analytics4;
         return _deleteLayoutColumn(api === null || api === void 0 || (_api$analytics4 = api.analytics) === null || _api$analytics4 === void 0 ? void 0 : _api$analytics4.actions)(props);
       },
-      distributeLayoutColumns: createDistributeLayoutColumnsCommand(api === null || api === void 0 || (_api$analytics5 = api.analytics) === null || _api$analytics5 === void 0 ? void 0 : _api$analytics5.actions),
+      distributeLayoutColumns: distributeLayoutColumns(api === null || api === void 0 || (_api$analytics5 = api.analytics) === null || _api$analytics5 === void 0 ? void 0 : _api$analytics5.actions),
       insertLayoutColumn: function insertLayoutColumn(side) {
         var _api$analytics6;
         return _insertLayoutColumn(side, api === null || api === void 0 || (_api$analytics6 = api.analytics) === null || _api$analytics6 === void 0 ? void 0 : _api$analytics6.actions);

package/dist/esm/pm-plugins/actions.js

@@ -662,93 +662,86 @@ export var setLayoutColumnValign = function setLayoutColumnValign(valign, editor
     return tr;
   };
 };
-export var distributeLayoutColumns = function distributeLayoutColumns() {
-  var _ref8 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-    editorAnalyticsAPI = _ref8.editorAnalyticsAPI,
-    _ref8$inputMethod = _ref8.inputMethod,
-    inputMethod = _ref8$inputMethod === void 0 ? INPUT_METHOD.LAYOUT_COLUMN_MENU : _ref8$inputMethod,
-    _ref8$target = _ref8.target,
-    target = _ref8$target === void 0 ? 'selectedColumns' : _ref8$target;
-  return function (_ref9) {
-    var tr = _ref9.tr;
-    if (!expValEqualsNoExposure('platform_editor_layout_column_menu', 'isEnabled', true)) {
-      return null;
-    }
-    var selectedLayoutColumnsResult = target === 'allColumns' ? getAllLayoutColumnsFromSelection(tr.selection) : getSelectedLayoutColumnsFromSelection(tr.selection);
-    if (!selectedLayoutColumnsResult || selectedLayoutColumnsResult.selectedLayoutColumns.length < 2) {
-      return null;
-    }
-    var layoutSectionNode = selectedLayoutColumnsResult.layoutSectionNode,
-      startIndex = selectedLayoutColumnsResult.startIndex,
-      endIndex = selectedLayoutColumnsResult.endIndex,
-      selectedLayoutColumns = selectedLayoutColumnsResult.selectedLayoutColumns;
-    var existingWidths = mapChildren(layoutSectionNode, function (column) {
-      return column.attrs.width;
-    });
-    var selectedWidths = selectedLayoutColumns.map(function (_ref0) {
-      var node = _ref0.node;
-      return node.attrs.width;
-    });
-    var distribution = calculateDistribution(selectedWidths);
-    if (!distribution) {
-      return null;
-    }
-    var selectedTotal = distribution.selectedTotal,
-      equalWidth = distribution.equalWidth;
-    if (isDistributedUniformly(selectedWidths, distribution)) {
-      return null;
-    }
-
-    // Build new widths array: selected columns get equal share, unselected unchanged.
-    // Assign rounded (2dp) equal widths to all selected cols except the last, which absorbs
-    // the rounding remainder so the sum of selected widths equals selectedTotal exactly.
-    var assignedToSelected = 0;
-    var selectedAssignedCount = 0;
-    var newWidths = existingWidths.map(function (w, idx) {
-      if (idx < startIndex || idx > endIndex) {
-        return w;
+export var distributeLayoutColumns = function distributeLayoutColumns(editorAnalyticsAPI) {
+  return function () {
+    var _ref8 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      _ref8$inputMethod = _ref8.inputMethod,
+      inputMethod = _ref8$inputMethod === void 0 ? INPUT_METHOD.LAYOUT_COLUMN_MENU : _ref8$inputMethod,
+      _ref8$target = _ref8.target,
+      target = _ref8$target === void 0 ? 'selectedColumns' : _ref8$target;
+    return function (_ref9) {
+      var tr = _ref9.tr;
+      if (!expValEqualsNoExposure('platform_editor_layout_column_menu', 'isEnabled', true)) {
+        return null;
       }
-      selectedAssignedCount += 1;
-      if (selectedAssignedCount < selectedLayoutColumns.length) {
-        assignedToSelected += equalWidth;
-        return equalWidth;
+      var selectedLayoutColumnsResult = target === 'allColumns' ? getAllLayoutColumnsFromSelection(tr.selection) : getSelectedLayoutColumnsFromSelection(tr.selection);
+      if (!selectedLayoutColumnsResult || selectedLayoutColumnsResult.selectedLayoutColumns.length < 2) {
+        return null;
+      }
+      var layoutSectionNode = selectedLayoutColumnsResult.layoutSectionNode,
+        startIndex = selectedLayoutColumnsResult.startIndex,
+        endIndex = selectedLayoutColumnsResult.endIndex,
+        selectedLayoutColumns = selectedLayoutColumnsResult.selectedLayoutColumns;
+      var existingWidths = mapChildren(layoutSectionNode, function (column) {
+        return column.attrs.width;
+      });
+      var selectedWidths = selectedLayoutColumns.map(function (_ref0) {
+        var node = _ref0.node;
+        return node.attrs.width;
+      });
+      var distribution = calculateDistribution(selectedWidths);
+      if (!distribution) {
+        return null;
+      }
+      var selectedTotal = distribution.selectedTotal,
+        equalWidth = distribution.equalWidth;
+      if (isDistributedUniformly(selectedWidths, distribution)) {
+        return null;
       }
-      // Last selected column: absorb the remainder to avoid drift
-      return Number((selectedTotal - assignedToSelected).toFixed(2));
-    });
 
-    // Apply widths via setNodeMarkup per selected column — keeps nodes in place (preserves identity, marks, decorations)
-    selectedLayoutColumns.forEach(function (_ref1, i) {
-      var node = _ref1.node,
-        pos = _ref1.pos;
-      var colIdx = startIndex + i;
-      tr.setNodeMarkup(pos, node.type, _objectSpread(_objectSpread({}, node.attrs), {}, {
-        width: newWidths[colIdx]
-      }));
-    });
-    editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
-      action: ACTION.UPDATED,
-      actionSubject: ACTION_SUBJECT.DOCUMENT,
-      actionSubjectId: ACTION_SUBJECT_ID.LAYOUT_COLUMN,
-      attributes: {
-        columnCount: layoutSectionNode.childCount,
-        endIndex: endIndex,
-        inputMethod: inputMethod,
-        selectedCount: selectedLayoutColumns.length,
-        startIndex: startIndex
-      },
-      eventType: EVENT_TYPE.TRACK
-    })(tr);
-    tr.setMeta('scrollIntoView', false);
-    return tr;
-  };
-};
-export var createDistributeLayoutColumnsCommand = function createDistributeLayoutColumnsCommand(editorAnalyticsAPI) {
-  return function () {
-    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    return distributeLayoutColumns(_objectSpread(_objectSpread({}, options), {}, {
-      editorAnalyticsAPI: editorAnalyticsAPI
-    }));
+      // Build new widths array: selected columns get equal share, unselected unchanged.
+      // Assign rounded (2dp) equal widths to all selected cols except the last, which absorbs
+      // the rounding remainder so the sum of selected widths equals selectedTotal exactly.
+      var assignedToSelected = 0;
+      var selectedAssignedCount = 0;
+      var newWidths = existingWidths.map(function (w, idx) {
+        if (idx < startIndex || idx > endIndex) {
+          return w;
+        }
+        selectedAssignedCount += 1;
+        if (selectedAssignedCount < selectedLayoutColumns.length) {
+          assignedToSelected += equalWidth;
+          return equalWidth;
+        }
+        // Last selected column: absorb the remainder to avoid drift
+        return Number((selectedTotal - assignedToSelected).toFixed(2));
+      });
+
+      // Apply widths via setNodeMarkup per selected column — keeps nodes in place (preserves identity, marks, decorations)
+      selectedLayoutColumns.forEach(function (_ref1, i) {
+        var node = _ref1.node,
+          pos = _ref1.pos;
+        var colIdx = startIndex + i;
+        tr.setNodeMarkup(pos, node.type, _objectSpread(_objectSpread({}, node.attrs), {}, {
+          width: newWidths[colIdx]
+        }));
+      });
+      editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
+        action: ACTION.UPDATED,
+        actionSubject: ACTION_SUBJECT.DOCUMENT,
+        actionSubjectId: ACTION_SUBJECT_ID.LAYOUT_COLUMN,
+        attributes: {
+          columnCount: layoutSectionNode.childCount,
+          endIndex: endIndex,
+          inputMethod: inputMethod,
+          selectedCount: selectedLayoutColumns.length,
+          startIndex: startIndex
+        },
+        eventType: EVENT_TYPE.TRACK
+      })(tr);
+      tr.setMeta('scrollIntoView', false);
+      return tr;
+    };
   };
 };
 export var toggleLayoutColumnMenu = function toggleLayoutColumnMenu(_ref10) {

package/dist/esm/pm-plugins/utils/layout-column-selection.js

@@ -1,6 +1,15 @@
+import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { findChildrenByType, findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 var findLayoutSectionFromSelection = function findLayoutSectionFromSelection(selection) {
-  return findParentNodeOfType(selection.$from.doc.type.schema.nodes.layoutSection)(selection);
+  var layoutSection = selection.$from.doc.type.schema.nodes.layoutSection;
+  // NodeSelection on the layoutSection node itself
+  if (selection instanceof NodeSelection && selection.node.type === layoutSection) {
+    return {
+      node: selection.node,
+      pos: selection.from
+    };
+  }
+  return findParentNodeOfType(layoutSection)(selection);
 };
 var findLayoutColumnsFromLayoutSection = function findLayoutColumnsFromLayoutSection(layoutSectionNode) {
   var layoutSectionPos = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;

package/dist/esm/ui/LayoutColumnMenu/DeleteColumnDropdownItem.js

@@ -1,7 +1,7 @@
 import React, { useCallback } from 'react';
 import { useIntl } from 'react-intl';
 import { layoutMessages } from '@atlaskit/editor-common/messages';
-import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
+import { DeleteIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
 import { useSelectedLayoutColumns } from './useSelectedLayoutColumns';
 var DeleteColumnDropdownItem = function DeleteColumnDropdownItem(_ref) {
   var api = _ref.api;
@@ -30,7 +30,12 @@ var DeleteColumnDropdownItem = function DeleteColumnDropdownItem(_ref) {
   }
   var selectedColumnCount = selectedLayoutColumns.selectedLayoutColumns.length;
   return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
-    onClick: onClick
+    onClick: onClick,
+    elemBefore: /*#__PURE__*/React.createElement(DeleteIcon, {
+      color: "currentColor",
+      label: "",
+      size: "small"
+    })
   }, formatMessage(layoutMessages.deleteColumn, {
     count: selectedColumnCount
   }));

package/dist/esm/ui/LayoutColumnMenu/DistributeColumnsDropdownItem.js

@@ -2,7 +2,7 @@ import React, { useCallback, useMemo } from 'react';
 import { useIntl } from 'react-intl';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { layoutMessages } from '@atlaskit/editor-common/messages';
-import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
+import { TableColumnsDistributeIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
 import { isDistributedUniformly } from '../../pm-plugins/utils/layout-column-distribution';
 import { useSelectedLayoutColumns } from './useSelectedLayoutColumns';
 export var DistributeColumnsDropdownItem = function DistributeColumnsDropdownItem(_ref) {
@@ -44,6 +44,11 @@ export var DistributeColumnsDropdownItem = function DistributeColumnsDropdownIte
   }
   return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
     onClick: handleClick,
-    isDisabled: isAlreadyUniform
+    isDisabled: isAlreadyUniform,
+    elemBefore: /*#__PURE__*/React.createElement(TableColumnsDistributeIcon, {
+      color: "currentColor",
+      label: "",
+      size: "small"
+    })
   }, formatMessage(layoutMessages.distributeColumns));
 };

package/dist/esm/ui/LayoutColumnMenu/InsertColumnDropdownItem.js

@@ -7,12 +7,12 @@ import { useSelectedLayoutColumns } from './useSelectedLayoutColumns';
 var INSERT_COLUMN_OPTIONS = {
   left: {
     Icon: TableColumnAddLeftIcon,
-    label: layoutMessages.insertColumnLeft,
+    label: layoutMessages.addColumnLeft,
     side: 'left'
   },
   right: {
     Icon: TableColumnAddRightIcon,
-    label: layoutMessages.insertColumnRight,
+    label: layoutMessages.addColumnRight,
     side: 'right'
   }
 };

package/dist/esm/ui/LayoutColumnMenu/VerticalAlignNestedMenu.js

@@ -23,7 +23,7 @@ export var VerticalAlignNestedMenu = function VerticalAlignNestedMenu(_ref) {
     }
     return firstValign;
   }, [selectedLayoutColumns]);
-  var TriggerIcon = currentValign ? VERTICAL_ALIGN_ICONS[currentValign] : VERTICAL_ALIGN_ICONS.top;
+  var TriggerIcon = currentValign ? VERTICAL_ALIGN_ICONS[currentValign] : VERTICAL_ALIGN_ICONS.middle;
   return /*#__PURE__*/React.createElement(ToolbarNestedDropdownMenu, {
     elemBefore: /*#__PURE__*/React.createElement(TriggerIcon, {
       label: "",

package/dist/esm/ui/LayoutColumnMenu/components.js

@@ -9,7 +9,7 @@ import { ToolbarMenuContainer } from '@atlaskit/editor-toolbar/toolbar-menu-cont
 import { DeleteColumnDropdownItem } from './DeleteColumnDropdownItem';
 import { DistributeColumnsDropdownItem } from './DistributeColumnsDropdownItem';
 import { InsertColumnDropdownItem } from './InsertColumnDropdownItem';
-import { DELETE_COLUMN_MENU_ITEM, DISTRIBUTE_COLUMNS_MENU_ITEM, INSERT_COLUMN_LEFT_MENU_ITEM, INSERT_COLUMN_RIGHT_MENU_ITEM, LAYOUT_COLUMN_MENU, LAYOUT_COLUMN_MENU_RANK, LAYOUT_COLUMN_MENU_SECTION, LAYOUT_COLUMN_MENU_SECTION_RANK, LAYOUT_COLUMN_VERTICAL_ALIGN_MENU_SECTION, VERTICAL_ALIGN_BOTTOM_MENU_ITEM, VERTICAL_ALIGN_MENU, VERTICAL_ALIGN_MENU_RANK, VERTICAL_ALIGN_MENU_SECTION_RANK, VERTICAL_ALIGN_MIDDLE_MENU_ITEM, VERTICAL_ALIGN_TOP_MENU_ITEM } from './keys';
+import { DELETE_COLUMN_MENU_ITEM, DISTRIBUTE_COLUMNS_MENU_ITEM, INSERT_COLUMN_LEFT_MENU_ITEM, INSERT_COLUMN_RIGHT_MENU_ITEM, LAYOUT_COLUMN_DANGER_SECTION, LAYOUT_COLUMN_DANGER_SECTION_RANK, LAYOUT_COLUMN_MENU, LAYOUT_COLUMN_MENU_RANK, LAYOUT_COLUMN_MENU_SECTION, LAYOUT_COLUMN_MENU_SECTION_RANK, LAYOUT_COLUMN_VERTICAL_ALIGN_MENU_SECTION, VERTICAL_ALIGN_BOTTOM_MENU_ITEM, VERTICAL_ALIGN_MENU, VERTICAL_ALIGN_MENU_RANK, VERTICAL_ALIGN_MENU_SECTION_RANK, VERTICAL_ALIGN_MIDDLE_MENU_ITEM, VERTICAL_ALIGN_TOP_MENU_ITEM } from './keys';
 import { VerticalAlignDropdownItem } from './VerticalAlignDropdownItem';
 import { VerticalAlignNestedMenu } from './VerticalAlignNestedMenu';
 var LayoutColumnMenuContainer = function LayoutColumnMenuContainer(_ref) {
@@ -62,15 +62,6 @@ export var getLayoutColumnMenuComponents = function getLayoutColumnMenuComponent
     parents: [_objectSpread(_objectSpread({}, LAYOUT_COLUMN_MENU_SECTION), {}, {
       rank: LAYOUT_COLUMN_MENU_SECTION_RANK[DISTRIBUTE_COLUMNS_MENU_ITEM.key]
     })]
-  }), _objectSpread(_objectSpread({}, DELETE_COLUMN_MENU_ITEM), {}, {
-    component: function component() {
-      return /*#__PURE__*/React.createElement(DeleteColumnDropdownItem, {
-        api: api
-      });
-    },
-    parents: [_objectSpread(_objectSpread({}, LAYOUT_COLUMN_MENU_SECTION), {}, {
-      rank: LAYOUT_COLUMN_MENU_SECTION_RANK[DELETE_COLUMN_MENU_ITEM.key]
-    })]
   }), _objectSpread(_objectSpread({}, VERTICAL_ALIGN_MENU), {}, {
     component: function component(_ref4) {
       var children = _ref4.children;
@@ -118,5 +109,25 @@ export var getLayoutColumnMenuComponents = function getLayoutColumnMenuComponent
     parents: [_objectSpread(_objectSpread({}, LAYOUT_COLUMN_VERTICAL_ALIGN_MENU_SECTION), {}, {
       rank: VERTICAL_ALIGN_MENU_SECTION_RANK[VERTICAL_ALIGN_BOTTOM_MENU_ITEM.key]
     })]
+  }), // --- Danger section (Delete column) ---
+  _objectSpread(_objectSpread({}, LAYOUT_COLUMN_DANGER_SECTION), {}, {
+    component: function component(_ref5) {
+      var children = _ref5.children;
+      return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
+        hasSeparator: true
+      }, children);
+    },
+    parents: [_objectSpread(_objectSpread({}, LAYOUT_COLUMN_MENU), {}, {
+      rank: LAYOUT_COLUMN_MENU_RANK[LAYOUT_COLUMN_DANGER_SECTION.key]
+    })]
+  }), _objectSpread(_objectSpread({}, DELETE_COLUMN_MENU_ITEM), {}, {
+    component: function component() {
+      return /*#__PURE__*/React.createElement(DeleteColumnDropdownItem, {
+        api: api
+      });
+    },
+    parents: [_objectSpread(_objectSpread({}, LAYOUT_COLUMN_DANGER_SECTION), {}, {
+      rank: LAYOUT_COLUMN_DANGER_SECTION_RANK[DELETE_COLUMN_MENU_ITEM.key]
+    })]
   })];
 };

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

@@ -3,6 +3,7 @@ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks'
 import { DRAG_HANDLE_SELECTOR } from '@atlaskit/editor-common/styles';
 import { Popup } from '@atlaskit/editor-common/ui';
 import { withReactEditorViewOuterListeners } from '@atlaskit/editor-common/ui-react';
+import { UserIntentPopupWrapper } from '@atlaskit/editor-common/user-intent';
 import { akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
 import { ToolbarDropdownMenuProvider } from '@atlaskit/editor-toolbar';
 import { SurfaceRenderer } from '@atlaskit/editor-ui-control-model';
@@ -96,6 +97,9 @@ export var LayoutColumnMenu = /*#__PURE__*/React.memo(function LayoutColumnMenu(
     offset: LAYOUT_COLUMN_MENU_POPUP_OFFSET,
     handleClickOutside: handleClickOutside,
     handleEscapeKeydown: closeLayoutColumnMenu
+  }, /*#__PURE__*/React.createElement(UserIntentPopupWrapper, {
+    api: api,
+    userIntent: "layoutColumnMenuPopupOpen"
   }, /*#__PURE__*/React.createElement(ToolbarDropdownMenuProvider, {
     isOpen: isLayoutColumnMenuOpen,
     setIsOpen: handleSetIsOpen
@@ -103,5 +107,5 @@ export var LayoutColumnMenu = /*#__PURE__*/React.memo(function LayoutColumnMenu(
     components: components,
     fallbacks: LAYOUT_COLUMN_MENU_FALLBACKS,
     surface: LAYOUT_COLUMN_MENU
-  })));
+  }))));
 });

package/dist/esm/ui/LayoutColumnMenu/keys.js

@@ -16,7 +16,11 @@ export var LAYOUT_COLUMN_VERTICAL_ALIGN_MENU_SECTION = {
   type: 'menu-section',
   key: 'layout-column-vertical-align-menu-section'
 };
-export var LAYOUT_COLUMN_MENU_RANK = _defineProperty({}, LAYOUT_COLUMN_MENU_SECTION.key, 100);
+export var LAYOUT_COLUMN_DANGER_SECTION = {
+  type: 'menu-section',
+  key: 'layout-column-danger-section'
+};
+export var LAYOUT_COLUMN_MENU_RANK = _defineProperty(_defineProperty({}, LAYOUT_COLUMN_MENU_SECTION.key, 100), LAYOUT_COLUMN_DANGER_SECTION.key, 200);
 
 // --- Menus ---
 
@@ -58,6 +62,7 @@ export var DELETE_COLUMN_MENU_ITEM = {
 
 // --- Item ranks within sections ---
 
-export var LAYOUT_COLUMN_MENU_SECTION_RANK = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, VERTICAL_ALIGN_MENU.key, 100), INSERT_COLUMN_LEFT_MENU_ITEM.key, 200), INSERT_COLUMN_RIGHT_MENU_ITEM.key, 300), DISTRIBUTE_COLUMNS_MENU_ITEM.key, 400), DELETE_COLUMN_MENU_ITEM.key, 500);
+export var LAYOUT_COLUMN_MENU_SECTION_RANK = _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, VERTICAL_ALIGN_MENU.key, 100), INSERT_COLUMN_LEFT_MENU_ITEM.key, 200), INSERT_COLUMN_RIGHT_MENU_ITEM.key, 300), DISTRIBUTE_COLUMNS_MENU_ITEM.key, 400);
+export var LAYOUT_COLUMN_DANGER_SECTION_RANK = _defineProperty({}, DELETE_COLUMN_MENU_ITEM.key, 100);
 export var VERTICAL_ALIGN_MENU_RANK = _defineProperty({}, LAYOUT_COLUMN_VERTICAL_ALIGN_MENU_SECTION.key, 100);
 export var VERTICAL_ALIGN_MENU_SECTION_RANK = _defineProperty(_defineProperty(_defineProperty({}, VERTICAL_ALIGN_TOP_MENU_ITEM.key, 100), VERTICAL_ALIGN_MIDDLE_MENU_ITEM.key, 200), VERTICAL_ALIGN_BOTTOM_MENU_ITEM.key, 300);

package/dist/esm/ui/LayoutColumnMenu/verticalAlignIcons.js

@@ -1,11 +1,11 @@
 // Disable no-re-export here, this is a useful mapping file for icon lookup used in multiple places
 /* eslint-disable @atlaskit/editor/no-re-export */
 
-import AlignContentBottomIcon from '@atlaskit/icon-lab/core/align-content-bottom';
-import AlignContentCenterVerticalIcon from '@atlaskit/icon-lab/core/align-content-center-vertical';
-import AlignContentTopIcon from '@atlaskit/icon-lab/core/align-content-top';
+import AlignPositionBottomIcon from '@atlaskit/icon-lab/core/align-position-bottom';
+import AlignPositionCenterVerticalIcon from '@atlaskit/icon-lab/core/align-position-center-vertical';
+import AlignPositionTopIcon from '@atlaskit/icon-lab/core/align-position-top';
 export var VERTICAL_ALIGN_ICONS = {
-  top: AlignContentTopIcon,
-  middle: AlignContentCenterVerticalIcon,
-  bottom: AlignContentBottomIcon
+  top: AlignPositionTopIcon,
+  middle: AlignPositionCenterVerticalIcon,
+  bottom: AlignPositionBottomIcon
 };

package/dist/esm/ui/toolbar.js

@@ -234,8 +234,7 @@ var getAdvancedLayoutItems = function getAdvancedLayoutItems(_ref) {
     disabled: isDistributedUniformly(getLayoutColumnWidths(node)),
     icon: TableColumnsDistributeIcon,
     onClick: function onClick(editorState, dispatch) {
-      var tr = distributeLayoutColumns({
-        editorAnalyticsAPI: editorAnalyticsAPI,
+      var tr = distributeLayoutColumns(editorAnalyticsAPI)({
         inputMethod: INPUT_METHOD.FLOATING_TB,
         target: 'allColumns'
       })({

package/dist/types/layoutPluginType.d.ts

@@ -8,8 +8,9 @@ import type { InteractionPlugin } from '@atlaskit/editor-plugin-interaction';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
 import type { UiControlRegistryPlugin } from '@atlaskit/editor-plugin-ui-control-registry';
+import type { UserIntentPlugin } from '@atlaskit/editor-plugin-user-intent';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
-import type { deleteLayoutColumn, createDistributeLayoutColumnsCommand, InsertLayoutColumnSide, insertLayoutColumnsWithAnalytics, setLayoutColumnValign, toggleLayoutColumnMenu } from './pm-plugins/actions';
+import type { deleteLayoutColumn, distributeLayoutColumns, InsertLayoutColumnSide, insertLayoutColumnsWithAnalytics, setLayoutColumnValign, toggleLayoutColumnMenu } from './pm-plugins/actions';
 import type { LayoutState } from './pm-plugins/types';
 import type { LayoutPluginOptions } from './types';
 export type LayoutPluginDependencies = [
@@ -22,7 +23,8 @@ export type LayoutPluginDependencies = [
     OptionalPlugin<InteractionPlugin>,
     OptionalPlugin<BlockMenuPlugin>,
     OptionalPlugin<ToolbarPlugin>,
-    OptionalPlugin<UiControlRegistryPlugin>
+    OptionalPlugin<UiControlRegistryPlugin>,
+    OptionalPlugin<UserIntentPlugin>
 ];
 export type LayoutPlugin = NextEditorPlugin<'layout', {
     actions: {
@@ -30,7 +32,7 @@ export type LayoutPlugin = NextEditorPlugin<'layout', {
     };
     commands: {
         deleteLayoutColumn: ReturnType<typeof deleteLayoutColumn>;
-        distributeLayoutColumns: ReturnType<typeof createDistributeLayoutColumnsCommand>;
+        distributeLayoutColumns: ReturnType<typeof distributeLayoutColumns>;
         insertLayoutColumn: (side: InsertLayoutColumnSide) => EditorCommand;
         setLayoutColumnValign: (valign: Parameters<typeof setLayoutColumnValign>[0]) => EditorCommand;
         toggleLayoutColumnMenu: typeof toggleLayoutColumnMenu;

package/dist/types/pm-plugins/actions.d.ts

@@ -5,13 +5,6 @@ import type { Command, EditorCommand, TOOLBAR_MENU_TYPE } from '@atlaskit/editor
 import type { Node } from '@atlaskit/editor-prosemirror/model';
 import type { EditorState, Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { Change, PresetLayout } from '../types';
-export type DistributeLayoutColumnsOptions = {
-    inputMethod?: INPUT_METHOD.LAYOUT_COLUMN_MENU | INPUT_METHOD.FLOATING_TB;
-    target?: 'selectedColumns' | 'allColumns';
-};
-type DistributeLayoutColumnsActionOptions = DistributeLayoutColumnsOptions & {
-    editorAnalyticsAPI?: EditorAnalyticsAPI;
-};
 export declare const ONE_COL_LAYOUTS: PresetLayout[];
 export declare const TWO_COL_LAYOUTS: PresetLayout[];
 export declare const THREE_COL_LAYOUTS: PresetLayout[];
@@ -42,8 +35,11 @@ export type InsertLayoutColumnSide = 'left' | 'right';
 export declare function getEffectiveMaxLayoutColumns(): number;
 export declare const insertLayoutColumn: (side: InsertLayoutColumnSide, editorAnalyticsAPI?: EditorAnalyticsAPI) => EditorCommand;
 export declare const setLayoutColumnValign: (valign: Valign, editorAnalyticsAPI?: EditorAnalyticsAPI) => EditorCommand;
-export declare const distributeLayoutColumns: ({ editorAnalyticsAPI, inputMethod, target, }?: DistributeLayoutColumnsActionOptions) => EditorCommand;
-export declare const createDistributeLayoutColumnsCommand: (editorAnalyticsAPI?: EditorAnalyticsAPI) => (options?: DistributeLayoutColumnsOptions) => EditorCommand;
+type DistributeLayoutColumnsOptions = {
+    inputMethod?: INPUT_METHOD.LAYOUT_COLUMN_MENU | INPUT_METHOD.FLOATING_TB;
+    target?: 'selectedColumns' | 'allColumns';
+};
+export declare const distributeLayoutColumns: (editorAnalyticsAPI?: EditorAnalyticsAPI) => ({ inputMethod, target, }?: DistributeLayoutColumnsOptions) => EditorCommand;
 export declare const toggleLayoutColumnMenu: ({ anchorPos, isOpen }: {
     anchorPos?: number;
     isOpen?: boolean;

package/dist/types/pm-plugins/utils/layout-column-selection.d.ts

@@ -1,6 +1,6 @@
 import type { Valign } from '@atlaskit/adf-schema/layout-column';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import type { Selection } from '@atlaskit/editor-prosemirror/state';
+import { type Selection } from '@atlaskit/editor-prosemirror/state';
 type FoundNode = {
     node: PMNode;
     pos: number;

package/dist/types/ui/LayoutColumnMenu/keys.d.ts

@@ -2,6 +2,7 @@ import type { MenuItemType, MenuSectionType, MenuType, NestedMenuType } from '@a
 export declare const LAYOUT_COLUMN_MENU: MenuType;
 export declare const LAYOUT_COLUMN_MENU_SECTION: MenuSectionType;
 export declare const LAYOUT_COLUMN_VERTICAL_ALIGN_MENU_SECTION: MenuSectionType;
+export declare const LAYOUT_COLUMN_DANGER_SECTION: MenuSectionType;
 export declare const LAYOUT_COLUMN_MENU_RANK: Record<string, number>;
 export declare const VERTICAL_ALIGN_MENU: NestedMenuType;
 export declare const INSERT_COLUMN_LEFT_MENU_ITEM: MenuItemType;
@@ -12,5 +13,6 @@ export declare const VERTICAL_ALIGN_MIDDLE_MENU_ITEM: MenuItemType;
 export declare const VERTICAL_ALIGN_BOTTOM_MENU_ITEM: MenuItemType;
 export declare const DELETE_COLUMN_MENU_ITEM: MenuItemType;
 export declare const LAYOUT_COLUMN_MENU_SECTION_RANK: Record<string, number>;
+export declare const LAYOUT_COLUMN_DANGER_SECTION_RANK: Record<string, number>;
 export declare const VERTICAL_ALIGN_MENU_RANK: Record<string, number>;
 export declare const VERTICAL_ALIGN_MENU_SECTION_RANK: Record<string, number>;

package/dist/types/ui/LayoutColumnMenu/verticalAlignIcons.d.ts

@@ -1,5 +1,5 @@
 import type { Valign } from '@atlaskit/adf-schema/layout-column';
-import AlignContentTopIcon from '@atlaskit/icon-lab/core/align-content-top';
-type VerticalAlignIcon = typeof AlignContentTopIcon;
+import AlignPositionTopIcon from '@atlaskit/icon-lab/core/align-position-top';
+type VerticalAlignIcon = typeof AlignPositionTopIcon;
 export declare const VERTICAL_ALIGN_ICONS: Record<Valign, VerticalAlignIcon>;
 export {};

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

@@ -8,8 +8,9 @@ import type { InteractionPlugin } from '@atlaskit/editor-plugin-interaction';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
 import type { UiControlRegistryPlugin } from '@atlaskit/editor-plugin-ui-control-registry';
+import type { UserIntentPlugin } from '@atlaskit/editor-plugin-user-intent';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
-import type { deleteLayoutColumn, createDistributeLayoutColumnsCommand, InsertLayoutColumnSide, insertLayoutColumnsWithAnalytics, setLayoutColumnValign, toggleLayoutColumnMenu } from './pm-plugins/actions';
+import type { deleteLayoutColumn, distributeLayoutColumns, InsertLayoutColumnSide, insertLayoutColumnsWithAnalytics, setLayoutColumnValign, toggleLayoutColumnMenu } from './pm-plugins/actions';
 import type { LayoutState } from './pm-plugins/types';
 import type { LayoutPluginOptions } from './types';
 export type LayoutPluginDependencies = [
@@ -22,7 +23,8 @@ export type LayoutPluginDependencies = [
     OptionalPlugin<InteractionPlugin>,
     OptionalPlugin<BlockMenuPlugin>,
     OptionalPlugin<ToolbarPlugin>,
-    OptionalPlugin<UiControlRegistryPlugin>
+    OptionalPlugin<UiControlRegistryPlugin>,
+    OptionalPlugin<UserIntentPlugin>
 ];
 export type LayoutPlugin = NextEditorPlugin<'layout', {
     actions: {
@@ -30,7 +32,7 @@ export type LayoutPlugin = NextEditorPlugin<'layout', {
     };
     commands: {
         deleteLayoutColumn: ReturnType<typeof deleteLayoutColumn>;
-        distributeLayoutColumns: ReturnType<typeof createDistributeLayoutColumnsCommand>;
+        distributeLayoutColumns: ReturnType<typeof distributeLayoutColumns>;
         insertLayoutColumn: (side: InsertLayoutColumnSide) => EditorCommand;
         setLayoutColumnValign: (valign: Parameters<typeof setLayoutColumnValign>[0]) => EditorCommand;
         toggleLayoutColumnMenu: typeof toggleLayoutColumnMenu;

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

@@ -5,13 +5,6 @@ import type { Command, EditorCommand, TOOLBAR_MENU_TYPE } from '@atlaskit/editor
 import type { Node } from '@atlaskit/editor-prosemirror/model';
 import type { EditorState, Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { Change, PresetLayout } from '../types';
-export type DistributeLayoutColumnsOptions = {
-    inputMethod?: INPUT_METHOD.LAYOUT_COLUMN_MENU | INPUT_METHOD.FLOATING_TB;
-    target?: 'selectedColumns' | 'allColumns';
-};
-type DistributeLayoutColumnsActionOptions = DistributeLayoutColumnsOptions & {
-    editorAnalyticsAPI?: EditorAnalyticsAPI;
-};
 export declare const ONE_COL_LAYOUTS: PresetLayout[];
 export declare const TWO_COL_LAYOUTS: PresetLayout[];
 export declare const THREE_COL_LAYOUTS: PresetLayout[];
@@ -42,8 +35,11 @@ export type InsertLayoutColumnSide = 'left' | 'right';
 export declare function getEffectiveMaxLayoutColumns(): number;
 export declare const insertLayoutColumn: (side: InsertLayoutColumnSide, editorAnalyticsAPI?: EditorAnalyticsAPI) => EditorCommand;
 export declare const setLayoutColumnValign: (valign: Valign, editorAnalyticsAPI?: EditorAnalyticsAPI) => EditorCommand;
-export declare const distributeLayoutColumns: ({ editorAnalyticsAPI, inputMethod, target, }?: DistributeLayoutColumnsActionOptions) => EditorCommand;
-export declare const createDistributeLayoutColumnsCommand: (editorAnalyticsAPI?: EditorAnalyticsAPI) => (options?: DistributeLayoutColumnsOptions) => EditorCommand;
+type DistributeLayoutColumnsOptions = {
+    inputMethod?: INPUT_METHOD.LAYOUT_COLUMN_MENU | INPUT_METHOD.FLOATING_TB;
+    target?: 'selectedColumns' | 'allColumns';
+};
+export declare const distributeLayoutColumns: (editorAnalyticsAPI?: EditorAnalyticsAPI) => ({ inputMethod, target, }?: DistributeLayoutColumnsOptions) => EditorCommand;
 export declare const toggleLayoutColumnMenu: ({ anchorPos, isOpen }: {
     anchorPos?: number;
     isOpen?: boolean;